Scribd
Upload
8 views

Introduction To HTML

Uploaded by

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

Introduction To HTML

Uploaded by

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

INTRODUCTION TO HTML

By
M.HEMAMALINI
DESIGNING A HOME PAGE
 The first page of a website is called the home page.
 It normally has the logo of the company, with a

pleasant background having several hot texts.


 HTML – Hyper-Text Mark-up Language
HISTORY OF HTML
 The seed for html was sown by IBM in the early
1980s.

 They wanted to set a documentation system in


which one could mark the title, headings,
paragraphs and font type selections.

 They called it General Mark-up Language (GML).


 ISO – standardized it as Generalized mark-up
language (SGML).

 Tim Berners Lee and his team in the European


Laboratory for particle Physics designed the present
form of the documentation language and it called it
HTML.
HTML DOCUMENTS
 Every HTML document has the following two sections
 Head
 Body
 The head begins with <HEAD> tag and ends with </
HEAD> tag .
 The title begins with <title> and ends with </title>.

 The body begins with <body> and ends with

</body>.
 Headings can be created with tags H1,H2…..H6.

 H1 will make a big heading

 H2 will make it smaller

 H3 will make it still smaller and so on.


 <HTML>
 <head>
 <title> HEADINGS </title>
 </head>
 <body>
 <h1> WELCOME TO HTML </h1>
 <h2> WELCOME TO HTML </h2>
 <h3> WELCOME TO HTML </h3>
 <h4> WELCOME TO HTML </h4>
 <h5> WELCOME TO HTML </h5>
 <h6> WELCOME TO HTML </h6>
 </body>
 </html>
 The following are some more tags

<!.......> Comments
<br> Line break
<p> Starts a new paragraph
<pre> </pre> Preformatted text
<b> </b> Bold face
<u> </u> Underline
<I> </I> Italics
<tt> </tt> Typewriter font
<ol> </ol> Ordered list
<ul> </ul> Unordered list
<li> </li> A list item
ANCHOR TAG
 When a page is shown some of its words may need
further explanation.
 Such words are called hot text and they appear in a

different color.
 When the cursor is moved to the hot text, a hand

symbol appears.
 When we click it , another HTML file will be opened

and that will have the required explanation.


 A hot text is created with an anchor tag <a>.

 For ex. If a hot text “st.xaviers College” is to be

created with an HTML document College.html we


must type
 <a href =“college.html”> St. Xaviers College </a>
 <HTML>
 <head>
 <title>Xavier</title>
 </head>
 <body>
 <h1>Dr.C Xavier</h1>
 <hr>
 <br>
 Dr C. xavier is working as a senior lecturer in computer
science in <a href=" college. html"> St Xavier's college
</a> palayamkottai. Palayamkottai and Tirunelveli are
considered as twin cities of the famous <a href="
district.html". Tirunelveli kattabomman</a>District.<br>
 </body>
 </HTML>
 The foregoing text of xavier.html has been shown on different
lines only for better readability.
 In this page, “st.Xaviers College” is a hot text. When this is
clicked , it will open College.html shown as follows.

 <HTML>
 <head>
 <title>College</title>
 </head>
 <body>
 <h1>St Xavier's College</h1>
 <hr>
 <br>
 St Xavier's College is a famous college. This was started in 1923
by the Society of Jesus. It is in Palayamkottai. Palayamkottai
and Tirunelveli are considered as twin cities of the famous <a
href="district. html"> Tirunelveli kattabomman</a>
 District.<br>
 </body>
 </HTML>
HYPER LINK
 when we click a hot text another HTML document
is opened.
 This is how we link two texts.
 This is called the hyper link.
 If a web site runs into several pages. It is possible
to define hyper links within the same web
document itself.
 < a name = comp > </a>
 An identification called COMP has been defined
using the anchor tag <A>. This is called the
identification of a location.
 < a href = “#Comp”> Computer Science </A>
 When the hot text computer science is clicked , the
cursor jumps to the location with the identification
COMP.
 <html>
 <head>
 <title> St.Xaviers College </title>
 <head>
 <body>
 <h1> St.Xaviers College </h1>
 --------
 --------
 The <a href = “#comp”> Computer science </a> is
rendering commendable service to the society.
 --------
 --
 < a name = comp > </a>
 <h4> Department of computer science </h4>
 The department offers…………………
 </body>
 The HTML document shown above is a single
document
 <a name = comp> </a> defines an identification

of the location.
 The identification of the location can also be

defined
 In the <br > tag or <h1> tag or any head or

similar tag.
 <a name = comp> </a>

 <h4> Department of computer science </h4>

 We can simply write

 <h4 id = comp> Department of computer science

</h4>
 <br id = comp>
 <head>
 <title> Tamil nadu Tourist Information </title>
 <body>
 Tamil Nadu very interesting tourist spots at the
following places
 <ul>
 <li> < a href = # maha”> Mahabalipuram </a>
 <li> < a href = # kodai”> Kodaikanal </a>
 <li> < a href = # OOty”> Ooty </a>
 …………………..
 < h4 id = maha > Mahabalipuram </h4>
 < h4 id = kodai > Kodaikanal </h4>
 < h4 id = Ooty > Ooty </h4>
 </body>

You might also like