Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
824 views

STD 10 Computer Chapter 1 Introduction To HTML

Uploaded by

coderandgamer7
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
824 views

STD 10 Computer Chapter 1 Introduction To HTML

Uploaded by

coderandgamer7
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Chapter 1 Computer

Introduction to HTML Class 10

Network
 When computers are connected with each other they can share resources. Such
group of connected computer is known as a computer network.

Internet
 The Internet is a collection of such multiple computer networks, hence known as
network of networks.

Web
 On the platform of the internet, a distributed information system exists, which is
called WWW (World Wide Web) or Web.
 The notion of the web was conceived in 1991 by Tim Berners-Lee, while consulting
at CERN (European Organization for Nuclear Research) in Switzerland.
 The web is a repository of multimedia information on the internet platform.
 The web content in form of web pages is explored using browser
 Individual document pages on the WWW are called web pages and are accessed
with a software application running on the user computer, commonly called a web
browser

Browser
 Special software applications to retrieve and view web information.

Website
 Website is a collection of web pages that display information about an organization
or institute.

Hyperlink
 On web pages, links are placed pointing towards different locations. These links are
known as hyperlink.
 Any content such as text, picture, graphics etc can be embedded with such
hyperlink.

HTML
 HTML (HyperText Markup Language), describe how a web page should be
displayed by a web browser. HTML is considered as a language for describing web
pages.
 The HTML is a documentation language to mark content of web pages such as
heading, title, table, image etc.

Presented by Nuzhat Ibrahim Memon 1


 A HTML is a kind of markup language.
language A markup language is a set of tags that
enables additional information(besides the content) on how to present the web
content. HTML files are text files that contain additional formatting markup
information in form of tag along with its content.
content
 HTML is derived from of SGML
o S-Standardized
o G-General
o M-Markup
o L-Language
 SGML was developed by the International Organization for Standards (ISO) in
1986.

HTML tag
• Several sets of angular brackets with words or letters within them. These brackets
and words inside them are known as tags.
• A tag is made up of letter, words and numbers enclosed between a left and righ
right
angular bracket. i.e <>

HTML Element
• A combination of opening and closing tag along with some content between the
two tags forms an element.

An HTML element may be empty or can have attributes to specify the additional
formatting and publishing instructions
tructions

Presented by Nuzhat Ibrahim Memon 2


Structure of an HTML Document

Structure of an HTML Document


• HTML document is structured into two major parts.
1. Head Section (Head element)
 It contains information about the page such as title and description of the
page.
 All these information should be embedded within the <head> and </head>
 Eg.Inside <head> section there is <title> element that is written in head section
and that will be displayed in the title bar of browser.
2. Body Section (Body element)
 The body element is embedded within the <body> and </body>
 This is the content which can be seen or display within the browser
Both the sections are embedded within the <html> and </html> tags.

HTML Title
 The title of a web page is specified by the TITLE element, which is placed in the head
section of the document.
 Document should have only one title element.
 Title should be simple text and cannot contain special commands such as hyperlinks.
 The title appears as a label of the window displaying the text.
 The title also holds a place in a browser’s history or bookmark list.

HTML Heading Style


 HTML document generally beginning with heading.
 Heading can be creating in total six inbuilt sizes names h1,h2,h3,h4, h5 and h6.
 Most browsers display the contents of the <h1>,<h2> and <h3> elements larger than
the default size of text in the document.
 The content of the <h4> element is similar to the default content size.
Presented by Nuzhat Ibrahim Memon 3
Paragraph tags (<p> and </p>)
 The <p> tag structures the content into a paragraph.
 Each paragraph of text should go in between an opening <p> and closing </p> tag.
 When an HTML code is displayed into a browser, the text will automatically take up
the full width of the screen.
 If you resize the browser window, the browser will trap the text onto new lines.
 Such white space management allows developer of HTML code to indent the code
and add extra spaces to maintain readability of the code.

Line break (<br> or <br/>)


 <br> tag is used for giving line break.
 <br> element does not have an opening and closing tags. Such tag are known as
empty tags.
 <br> is an abbreviated form of break.
 The <br> just pushes the coming text into new line.
 In case you need multiple lines, simply use multiple <br> tags.
 <br> in paragraph forces compulsory break into the content and disturbs text
wrapping while presentation and resizing the browser window.

Preformatted Text (<pre> and </pre>)


 Many a times we want to display text with multiple white spaces and in multiple
lines without wanting to be changed it by the browser. For that we may embed the
content into pre-formatted tag set using <pre> and </pre>.
 Any text between the opening <pre> and the closing </pre> tag will preserve the
formatting of the given content.
 It display the content of notepad in the same format in the browser.

Text Formatting Tags


Elements Description
Bold (<b> and </b>) The content is displayed in bold.
Underline (<u> and </u>) The content is displayed in underline.

Italics (<i> and </i>) The content is displayed in Italic.


Strike Through (<s> and </s>) It displays the word in strikethrough manner.
Type writer font (<tt> and </tt>) Displays text in typewriter font which is also identified as
monospaced font (like that of a teletype machine)

Presented by Nuzhat Ibrahim Memon 4


Other Text Formatting Tags
Elements Description

<small> and </small> The content is displayed one font size smaller than the rest of the
text surrounding it.
<big> and </big> The content is displayed one font size bigger than the rest of the text
surrounding it.
<sup> and </sup> The content is displayed in superscript.
<sub> and </sub> The content is displayed in subscript.
<acronym> and It defines the content as an acronym.
</acronym> The <acronym> tag is used to spell out another word.
<dfn> and </dfn> It defines a special term.
<q> and </q> It defines a quote.

Attributes to the Tags


 To specify more information along with tags, additional attribute accompany the
tags.
 In other words, attributes tell more about the elements.
 Attributes always appear on the opening tags of the elements that carry them.
 An attribute is made up of two parts:
o The first part is a name
 The name of an attribute indicates the property to be set
o the second part is a value.
 The value is a value to be set to the property.
 The values should be in double quotation marks.
 Between the name and the value there should be an equal (=) sign
 Example : <body bgcolor=“yellow”> Click here</a>

Align attribute
 The align attribute indicates whether the heading appears to the left, center or right
of the page.
 By default, the content is aligned to the left of the page.
 It can take three values as follows:
– Left: The content is aligned to the left of the page.
– Right: The content is aligned to the right of the page.
– Center: The content is aligned to the center of the page.
 There are some attributes which can appear along with every tag. Such attributes are
called universal attributes.
– Align is such universal attribute.
– <p align=“right”>Some content goes here</p>
Presented by Nuzhat Ibrahim Memon 5
– Being a universal attribute, the align attribute can also go with heading.
<h1 align=“center”>Some heading goes here</h1>
Soft spaces and hard spaces in HTML
 When content given in a paragraph is aligned, some spaces are automatically added
for adjustment. The spaces which are inserted automatically are known as soft
spaces.
 If users himself (manually) inserts some spaces, such hard spaces will be
automatically deleted unless the content is written using <pre> and </pre> tag pairs.

Anchor tag
 A website, collection of many web pages, manages web pages through such hyperlink
management.
– To create link between web pages, we need hyperlink.
– The hyperlink is a way to link two HTML documents by creating a hyper text in
a document and giving reference of the other document to it.
 Set of such words or text that appears in different colour (generally blue and
underlined) are called hyperlink.
 A hyperlink is created using an <a> element, where the ‘a’ stands for an anchor.
 It uses the attribute “href” that stands for hyperlink or hypertext reference
 The value of the href attribute is the name and address of the webpage to which we
want to refer.

Absolute or Relative Address


 Relative Address
– Instead of giving a full address, we have given only the file name.
– Giving just a file name will work only when you have the calling file and called
file in the same directory.
– The location of the called file is relative to the calling file. Hence it is known as
a relative address. <a href=“heading_style.html”>Heading Size</a>
 Absolute Address
– While the complete address is known as an absolute address.
<a href=“file:///C:/Users/Nuzhat%20Memon/Desktop/HTML%20Programs/heading_style.html”>
Heading Size </a>
SciTE
 SciTE is a text editor based on a free source code editing component called Scintilla
(http://www.scintilla.org)
 The menu items include basic facilities for file operations, editing facilities, searching,
viewing and other tools options etc.
 Some icons for basic operations such as new, open, save, edit, search etc.

Current Version of HTML


• Latest version of the HTML is called HTML 5.0
Presented by Nuzhat Ibrahim Memon 6

You might also like