Scribd
Upload
162 views

HTML

Tim Berners-Lee invented HTML in 1990 to make it easier for scientists to share research documents between universities. HTML is the language that allows information to be presented on the internet by defining the structure and layout of web pages. The basic structure of an HTML document includes head and body tags, and common tags are used to define text formatting, lists, links, images, tables and forms.

Uploaded by

api-3826226
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPS, PDF, TXT or read online on Scribd
162 views

HTML

Tim Berners-Lee invented HTML in 1990 to make it easier for scientists to share research documents between universities. HTML is the language that allows information to be presented on the internet by defining the structure and layout of web pages. The basic structure of an HTML document includes head and body tags, and common tags are used to define text formatting, lists, links, images, tables and forms.

Uploaded by

api-3826226
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPS, PDF, TXT or read online on Scribd
You are on page 1/ 31

HTML

Sarbbottam Bandyopadhyay
What is HTML?
 HTML is the "mother tongue" of your browser.
 HTML was invented in 1990 by a scientist called Tim
Berners-Lee. The purpose was to make it easier for
scientists at different universities to gain access to each
other's research documents. By inventing HTML he laid the
foundation for the Internet as we know it today.
 HTML is a language, which makes it possible to present
information on the Internet. What you see when you view a
page on the Internet is your browser's interpretation of
HTML.

Sarbbottam Bandyopadhyay
Basic HTML Structure.
<HTML>
<HEAD>
<TITLE>
your document title goes here
</TITLE>
</HEAD>
<BODY>
your document text goes here
</BODY>
</HTML>

Sarbbottam Bandyopadhyay
Basic HTML tags.
 <PRE></PRE> for pre formatting.
 <B></B> for bold.
 <U></U> for under line
 <I></I> for italic.
 <H1></H1> …. <H6></H6> for header.
 <P></P> for paragraphs.
 <BR> for line breaks.
 <HR> for horizontal rule.

Sarbbottam Bandyopadhyay
Simple HTML code using basic tags.
<HTML>

<HEAD>
<TITLE>
My first HTML page
</TITLE>
</HEAD>

<BODY>
<h1>In header &ltH1&gt</h1>
<h2>In header &ltH2&gt</h2>
<h3>In header &ltH3&gt</h3>
<h3>In header &ltH4&gt</h4>
<h5>In header &ltH5&gt</h5>
<h6>In header &ltH6&gt</h6>
This is my first HTML page.( Without any tag )
<pre>
This is my
first HTML page. ( Within &ltPRE&gt tag )
</pre>
<b>
This is my first HTML page.( Within &ltB&gt tag )
</b>
<br>

<br>
<i>
This is my first HTML page.( Within &lti&gt tag )
</i>
<p>
This is my
first HTML page.( Within &ltp&gt tag )
</p>
The horizontal line below is due to &lthr&gt.
<hr>
</BODY>

</HTML>

Sarbbottam Bandyopadhyay
DIV tag

DIV is used for division


<DIV class=“?.css”>
</DIV>

Sarbbottam Bandyopadhyay
Lists in HTML

 Ordered (Numbered) List


 Unordered (Bulleted) List
 Definition List

Sarbbottam Bandyopadhyay
Ordered (Numbered) List

<OL>
<LI> 1st content.
<LI> 2nd content.
<LI> and so on….
</OL>

Sarbbottam Bandyopadhyay
Unordered (Bulleted) List

<UL>
<LI> 1st content.
<LI> 2nd content.
<LI> and so on….
</UL>

Sarbbottam Bandyopadhyay
Definition List

<DL>
<DT>
<DD>
<DT>
<DD>
</DL>

Sarbbottam Bandyopadhyay
Hypertext Linking
 Hypertext Linking To Another File
<A HREF="http://www.google.com/">
Google</A>
 Hypertext Linking Within the Same File

<A HREF="#Jump">Jump down to the word


"Here"</A>
<P>[more text here]</P>
<A NAME="Jump">This is where you end
up.</A>
Sarbbottam Bandyopadhyay
Images

 <IMG SRC=“path of the picture/URL”>


 ALT=“Message” within <IMG> tag
 HSPACE
 VSPACE

Sarbbottam Bandyopadhyay
Movie clips

 <IMG DYNSRC=“path of the clip/URL”>


 Attribute

CONTROLS to add control button


LOOP = INFINITE | number of times
START = FILEOPEN | MOUSEOVER

Sarbbottam Bandyopadhyay
Table
 <TABLE>
 <TR> for rows.
 <TH> for header
 </TH>
 <TD> for columns
 </TD>
 </TR>
 </TABLE>

Sarbbottam Bandyopadhyay
Table properties

 cellSpacing
 cellPadding
 border
 width
 rowspan
 colspan

Sarbbottam Bandyopadhyay
Embedded table
<TABLE>
<TR>
<TD>
<TABLE>
<TR>
<TD>
</TD>
<TD>
</TD>
</TR>
</TABLE>

</TD>
<TD>
</TD>
</TR>
</TABLE>

Sarbbottam Bandyopadhyay
Form

 <FORM>
 </FORM>
 NAME
 ACTION
 METHOD

Sarbbottam Bandyopadhyay
Form element
 Submit button
 Button
 Reset button
 Text input area
 Pull down menu
 Radio button
 Check box button
 Text area
 Password field
 Hidden fields
 Active images

Sarbbottam Bandyopadhyay
Text input area

<INPUT TYPE=TEXT NAME=“some name”


VALUE=“some value”>

Sarbbottam Bandyopadhyay
Password field

<INPUT TYPE=PASSWORD NAME=“some


name” VALUE=“some value”>

Sarbbottam Bandyopadhyay
Hidden fields

<INPUT TYPE=HIDDEN NAME=“some name”


VALUE=“some value”>

Sarbbottam Bandyopadhyay
Check box button

<INPUT TYPE=CHECKBOX NAME=“some


name" VALUE=“some value" >

Sarbbottam Bandyopadhyay
Radio button

<INPUT TYPE=RADIO NAME=“some name"


VALUE=“some value" >

Sarbbottam Bandyopadhyay
Text area

<TEXTAREA NAME=“some name” COLS=“ ”


ROWS=“ ” >
</TEXTAREA>

Sarbbottam Bandyopadhyay
Pull down menu

<SELECT NAME=“some name”>


<OPTION VALUE=“”> your 1st option
<OPTION VALUE=“”> your nth option
</SELECT>

Sarbbottam Bandyopadhyay
Active images

<INPUT TYPE=IMAGE SRC=“path of the


image” NAME=“some name" VALUE=“some
value" >

Sarbbottam Bandyopadhyay
Reset button

<INPUT TYPE=RESET NAME=“some name"


VALUE=“some value" >

Sarbbottam Bandyopadhyay
Submit button

<INPUT TYPE=SUBMIT NAME=“some name"


VALUE=“some value" >

Sarbbottam Bandyopadhyay
Button

<INPUT TYPE=BUTTON NAME=“some name"


VALUE=“some value" >

Sarbbottam Bandyopadhyay
Frame
<HTML>
<HEAD>
<TITLE> New Frame </TITLE>
</HEAD>
<frameset cols="*,*">
<frame src=“file name" name="" noresize scrolling=no>
<frameset rows="*,*" >
<frame src=" file name " name="" >
<frame src=" file name " name="" >
</frameset>

<BODY>

</BODY>
</HTML>

Sarbbottam Bandyopadhyay
Thank you.

Sarbbottam Bandyopadhyay

You might also like