Html update1(30 8-2009)

271 views

Published on

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
271
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Html update1(30 8-2009)

  1. 1. HTML (Hypertext Markup Language)Internet:-Internet is a network of millions computers connected to each other throughnetwork cables, telephone cables and Satellite links sharing different information and dataaround the word.Initially HTML was known by the name called GML (General Mark-up Language) withthe help of GML we can create WebPages and add title, heading, text, font selection andmuch more.In 1986 SGML (Standard Generalized Mark-up Language) was introduced.In 1989, Tim Berners Lee and his team designed language and named it as HTML(Hyper Text Mark-up Language).Definition: - HTML is a language that used to describe the structure of a web page orHTML is a complete code that allows the user to create web pages. It includes text andgraphics. You can add hyper links to your web pages.Hyper text: - Hyper text is a text to link various web pages or web documents.Mark-up: - Highlightly text, by Underlining or color.Language: - Way of communication between web pages, which has its own syntax andRules.Today HTML is the most commonly used language to write web pages.Features of HTML:- 1. Easy to Understand. 2. With the help of HTML we can include text, graphics, table, Hyperlinking, sound etc. in our webpage. 3. We can easily modify our web page. 4. It is a case sensitive language. 5. It is a platform independent language. To create a web page:- 1. First Open Note Pad. 2. Create HTML code. 3. Save file with extension .HTML or HTM 4. Open Web Browser (Internet Explorer, Opera etc. and your web page.)Web Browser: It is client software that allows user to display and interact with a hyperdocument. HTML is a Tag Bases language. Tag is an element, which instruct the web Browser, what to show and How to show. We can use various attributes in the Tag that contains additional information like formatting effects, alignment, color, size etc. each tag giving a specific instruction is enclosed in “<>” angular Brackets.
  2. 2. Example of HTML code:- Ex-1 <Html> <Head> <Title> Hello</Title> </Head> <Body> Multimedia Dot Com </Body> </Html>HTML Elements: An element is used to mark the structure of a document.Document Structure Elements are required within an HTML document for it to conform toHTML standards. The essential document structure elements are:- <HTML>………..</HTML> <HEAD>………..</HEAD> <BODY>………..</BODY>The HTML element is not visible on the HTML document when displayed by the browser.HTML elements contain the HEAD and BODY elements.There are two types’ of tags:- 1. Container A Container element has a starting tag and an ending tag. Ex: - <HTML>……. </HTML> 2. Empty/Non Container An empty element does not have an ending tag. Ex:- <BR> NON CONTAINER TAGS 1. BR(Break):- This tag breaks the line and displays the from the next line, without giving any space between two lines. Syntax:- <BR> 2. HR(Horizontal Ruler):- The <HR> element draws a horizontal line across the page. Syntax with Attributes: - <HR size=12 width=60% align= center noshade> Where Size = Specifies the thickness of line. Width = Specifies the length of line. Align = Specifies the alignment of line. Noshade = Produce a solid block line that has no shading. 3. &LT:- This attribute displays <(less than) sign on the Browser. Ex- 23&LT30 4. &GT:- This attribute displays >(Greater than) sign on the Browser. Ex- 40&LT30 5. &AMP:- This attribute displays & sign on the Browser. 6. &nbsp:- Spaces in an HTML file are ignored when the page is displayed on web browser. “&nbsp;” is a special tag used to insert blank spaces.
  3. 3. Standard Element in HTML Element Function Starting Tag Ending Tag This element signifies HTML the beginning and end of <HTML> </HTML> an HTML document This element identifies the properties of the HEAD entire document such as <HEAD> </HEAD> its title. This element is used to TITLE give a title to the HTML <TITLE> </TITLE> document. The body of the document has the BODY content of the document. <BODY> </BODY> It is placed after the Title of the document. This element is used to add paragraphs to the document after PARAGRAPH providing the headings <P> </P> and title to the document. Ex-2<Html> <Head> <Title>My First File</title> </head> <Body bgcolor=”Green” or background=“as.jpg” Leftmargin=”60” topmargin=”60” > This is My First Html File </body></html>Description of Elements and Attribute: 1. bgcolor: This attribute allows setting of the background color for the document. 2. margin: The leftmargin attribute allows the left-hand margin to be set. The above code will give an output, where the text in between the BODY element will be indented 60 pixels away from the left side of the page. ------------------------------------------------------------------------------------------------------- Ex-3 ------------------------------------------------------------------------------------------------------- <Html> <Head> <Title>My First File</title> </head> <Body> <font face=”arial” color=”red” size=5 > This is My First Html File </font> <font face=”arial” color=”blue” size=5 > Created in Multimedia Dot Com </font> </body> </html>
  4. 4. CHATRECTER FORMATING ELEMENTSThe character formatting elements are also called physical formatting elements .In thiskind of formatting the other of the document and put it effectively on the user’s screen.It is important to specify how a particular text should be displayed on the screen sameof the character formatting elements have been discussed below. BOLD FACE ELEMENTThe bold face element specifies that the text should be displayed in bold face, whereavailable, otherwise the browser will display the text in any other form.An example:- The instruction <B> must be read <B> before continuing.Would display:-The instruction must be read before continuing. BIG ELEMENTThe Big element specifies that enclosed text should be displayed, if practical by using abigger font as compared to the current font. The text to be displayed in bigger font is to be enclosed in<BIG>……</BIG>. ITALICS ELEMENTThe italics element specifies that the text should be displayed in italics font style.Where available, otherwise the browser the will displayed the text in any other font.Example:- Anything between the <I> I ELEMENT </I> should be Italics.Would display:-Anything between the I ELEMENT should be Italics. SMALL ELEMENTThe small element specifies that the enclosed text should be displayed. If particular, byusing a smaller font as compared to the current font. The text to be displayed in bigger font is to be enclosed in<SMALL>…..</SMALL>. STRIKE THROUGHThis element state that enclosed text should be displayed with a horizontal +ive strikethrough the text.As an example:- this text would be <STRIKE>Struck through </STRIKE>.Would display:-This text would be Strike through.
  5. 5. SUBSCRIPT ELEMENTThis element specifies that the enclosed text should be displayed as a subscript and, ifpractical, by using a smaller font. As an example: - this is the main text, with <SUB> this part </SUB> being subscript. Would display:- This is the main text, with this part being subscript. SUPERSCRIPT ELEMENT This element specifies that the enclosed text should be displayed as a superscript and, if practical, by using a smaller font. As an example:- this is the main text, with <SUP> this part</SUP> being superscript. Would display:- This is the main text, with the part being superscript. UNDERLINE ELEMENT This underline element state that the enclosed text should be displayed, as underline. As an example: - this <u> main points </u> of the exercise. Would display:- The main point of the exercise. MARQUEEThe Marquee element allows the author to create a scrolling text marquee. It highlights thescrolling text. It has a number of attributes. Important attributes of marquee:- BEHAVIOR:- Defines the scroll nature. BGCOLOR:- Defines the Background color. DIRECTION:- Specifies the scroll direction. HEIGHT:- Defines the height of the marquee Bar. WIDTH:- Defines the width of the marquee Bar. LOOP:- Specifies the number of scroll. SCROLL AMOUNT:- Specifies scroll speed. SCROLL DELAY:- Specifies delay between two scrolls. ALIGN:- Defines the alignment.
  6. 6. ------------------------------------------------------------------------------------------------------- Ex-4---------------------------------------------------------------------------------------------------------<Html> <Head> <Title>Marquee</title> </head> <Body><Marquee Align=”top or middle or bottom” Behavior=”scroll or slide or alternate”bgcolor=”red” height=”50%” width=”50%” scrollamount=20 scrolldelay=5direction=”left” or “right” or “Up” or “Down”>Multimedia Dot Com</marquee> </body></html>------------------------------------------------------------------------------------------------------- Ex-5------------------------------------------------------------------------------------------------------- HEADINGThis tag is used to define different heading levels in the HTML document. There are sixheading levels H1 to H6.These containers start with <H1>……. <H6> tag and end with </H1>…….</H6> tag. Textcoming in between these tags appears in different sizes. Text with H1 appears withmaximum size whereas text with H6 appears with minimum size. We can say that sizehierarchy is H1>H2> H3> H4>H5> H6>.<Html> <Head> <Title>Heading</title> </head> <Body> <h1>this is heading 1</h1> <h2>this is heading 2</h2> <h3>this is heading 3</h3> <h4>this is heading 4</h4> <h5>this is heading 5</h5> <h6>this is heading 6</h6> </body></html>------------------------------------------------------------------------------------------------------- Ex-6-------------------------------------------------------------------------------------------------------<Html> <Head> <Title>Alignment </title> </head> <Body> <h1 align=”Center”>this is center align</h1> <h2 align=”left”>this is left align </h2>
  7. 7. <h2 align=”right”>this is right align </h2> <center> HTML is a language that used to describe the structure of a web page or HTML is the encoding scheme used for creating a web document. </center> </body> </html> ------------------------------------------------------------------------------------------------------- Ex-7 ------------------------------------------------------------------------------------------------------- ListList is collection of similar type of data. Or A list is used to represent a series of relateditems as a visual and informational unit.Like the tool “Bullet and Numbering” we have in MS-Office application, in HTML. Wecan do the similar thing using the container tag <OL>……</OL>,<UL>……</UL>and <LI>……</LI><OL> is for ordered list, where the list items come with different forms of indexnumbers.<UL> is for Un-ordered list, where the list items come with different types of bullets.<LI> is used with the list items, in <OL> as well as in <UL>Important attributes:-OL-START:- Specifies the start Index number.OL-TYPE:- Defines the form of Index number.UL-TYPE:- Defines he form of Index number.LI-TYPE:- Defines the bullet type when used with <UL>VALUE:- Specifies the index number when used with <OL>. <Html> <Head> <Title>List Element</title> </head> <Body> List of Students in HTML Class <ol> <li> Rakesh <li> Anup <li> Govind <li> Ankit </ol> <ol type="square"> <li>Dehradun</li> <ul type="i"> <li>IMA</li> <li>FRI</li> <li>IMA</li> <li>FRI</li> </ul> <li>Vikasnagar</li> <ul type="circle">
  8. 8. <li>IMA</li> <li>FRI</li> </ul> </ol> </body> </html>NOTE:- Where <ol> = Ordered List <ul> = Unordered List <li> = List Item ------------------------------------------------------------------------------------------------------- Ex-8 -------------------------------------------------------------------------------------------------------<Html> <Head> <Title>List Menu, Directory List, Definition List </title> </head> <Body> Directory List Element:- <dir> <li>Rohit <li>Sonu <li>Vishal <li>Rajeev </dir> Menu List Element:- <menu> <li>Rohit <li>Sonu <li>Vishal <li>Rajeev </Menu> Definition List Element:- <dl> <dt> Term<dd>This is the definition of the First term. <dt> Term<dd>This is the definition of the Second term. </dl> </body> </html> ------------------------------------------------------------------------------------------------------- Ex-9 ------------------------------------------------------------------------------------------------------- Table A table is used to display data in a tabular format on the screen. A Table consists of rows and columns and the intersection of a row and column is called a cell.<Html> <Head> <Title>Table</title> </head>
  9. 9. <Body><table> <tr> <td>S.No.</td></table> </body> </html>Attributes of Table 1. BORDER:- The border attribute draws borders around all the table cells 2. BORDERCOLOR:- bordercolor sets the color of the border of the table. 3. BORDERCOLORLIGHT:- This attribute is set to give a three-dimensional effect to the table. This is done by giving a lighter color to the border while displaying a three-dimensional table. Example:- <table border=3 bordercolorlight=#ff0000 > 4. BORDERCOLORDARK:- This attribute is the opposite of bordercolorlight. This is done by giving a dark color to the border while displaying a three-dimensional table. Example:- <table border=3 bordercolordark=#0000ff > 5. BGCOLOR:- This attribute of the table element allows the background color to be set for the table 6. WIDTH:- This attribute is used to set the width of the table, as eithet an absolute width, or a percentage of the document width. 7. HEIGHT:- The height attribute of the table is set, either as a pixel value or as a percentage of the display window. 8. CELLSPACING:- This attribute when used with the TABLE element allows control over the space used between the cells in a table. The syntax for using this is, cellspacing=value. The value should be a pixel value. 9. CELLPADDING:- The cellpadding attribute allows control over the space inserted between the cell data and the cell wall in a table. The syntax for using this is, Cellpadding =value. The value should be a pixel value. Example:- <table border=0 cellspacing=0 cellpading=0> 10. ALIGN:- this attribute is used to align a table to either left or right of the page. Example:- <table align=left or right or center> 11. VALIGN:- The valign attribute specifies that the table can be either top or bottom aligned. The default is center aligned. Example:- <table valign=bottom or top> TR(Table Row) This element specifies a table row. It is a container element which container element which contain the <td>….</td> element. The number of rows in a table depends on
  10. 10. how many<tr> elements are contained within the table, regardless of cells that may attempt to use the rowspan attribute, where one row can span the width of more than one row. The contents of a row are placed between <tr> and </tr> elements. TD(Table Data) This element stands for table data, and it specifies a standard table data cell. A table data cell must only appear within table rows. Each row need not have the same number of cells specified, science short rows will be padded with blank cells on the right. Example<html><head> <title>table></title></head> <body bgcolor=gold><table border=1> <tr> <td>S.NO.</td> <td>Name</td> <td>Address</td> </tr> <tr> <td>1</td> <td>Rahul</td> <td>Vikasnagar</td> </tr> <tr> <td>2</td> <td>Anurag kumar Som</td> <td>Dakpathar</td> </tr></table></body></html> Example With All Attributes<Html> <Head> <Title> Exercise1 </Title> </Head><Body Bgcolor=Pink> <Table Border=2 Bordercolor=Blue Cellpadding=15 Cellspacing=20 Width=50% Height=60% Align=Center bordercolordark=green bordercolorlight=red> <tr bgcolor=Red> <td> S.No.</td> <td> Name</td> <td> Adders</td> <td> Phone No.</td>
  11. 11. </tr> <tr bgcolor=Yellow> <td> 1.</td> <td> Lucky</td> <td> Vikeshnager</td> <td>7894561230</td> </tr> <tr bgcolor=Green> <td> 2.</td> <td> Anurag</td> <td> Dakpather</td> <td>420420420</td> </tr></Body></Table></Html> Rowspan & ColspanColspan:- This attribute can appear within any table cell, and it specifies the number ofcolumns the cell can span. The default Colspan for any cell is 1.Rowspan:- The rowspan attribute specifies the number of rows the cell can span. Thedefault span for any cell is 1.<html><head> <title>rank</title></head> <body bgcolor=008945><table border=1 width=400 height=40><tr> <td bgcolor=yellow rowspan=4><center>a</center></td> <td bgcolor=yellow colspan=1><center>b</center></td> <td bgcolor=yellow colspan=1><center>c</center></td> <td bgcolor=yellow colspan=1><center>d</center></td></tr> <tr> <td bgcolor=liem rowspan=5><center>e</center></td> <td bgcolor=gold><center>f</center></td> <td bgcolor=gold><center>g</center></td> </tr><tr> <td bgcolor=lime><center>h</center></td> <td bgcolor=lime><center>i</center></td></head></html>Output:- b c d a f g e h i Marksheet
  12. 12. <HTML><HEAD><TITLE>Table Exercise-2</title><body bgcolor=black><table border=1 width=100% height=80><tr> <td bgcolor=pink rowspan=1 colspan=7><font face="BernhardModBT"color="black"><center>H.N.B Garhwal Univwesity<br>Srinagar(Garhwal)Uttarakhand<br>STATEMENT OF THE MARKS FOREXAMINATION</center>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp&nbsp;&nbsp;&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;S.No.-2567894<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Roll No.-2467802<br><BR>Name of the student:.........<br> Fathers Name:...........<br>Name of the college/Campus:.........<br>Name ofclass:..........</td></font></tr><tr> <td bgcolor=gold rowspan=1><font face="Hancock"color="black">Subject <td bgcolor=gold colspan=1><font face="Hancock"color="black">Max.Marks
  13. 13. <td bgcolor=gold colspan=1><font face="Hancock"color="black">Min.Marks <td bgcolor=gold COLSPAN=1 rowspan=6><table border=1 width=100% height=10><tr> <td COLSPAN=3><center><font face="Charlesworth"color="red">paper</center></tr><tr> <td bgcolor=yellow><font face="Charlesworth"color="red">I <tD bgcolor=yellow><font face="Charlesworth"color="red">II <td bgcolor=yellow><font face="Charlesworth"color="red">III<tr> <td bgcolor=yellow><font face="times new roman"color="black">18/35 <td bgcolor=yellow><font face="times new roman"color="black">28/35 <td bgcolor=yellow><font face="times new roman"color="black">28/30<tr> <td bgcolor=yellow><font face="times new roman"color="black">35/50 <td bgcolor=yellow><font face="times new roman"color="black">37/50 <td bgcolor=yellow><font face="times new roman"color="black">x<tr> <td bgcolor=yellow><font face="times new roman"color="black">28/40 <td bgcolor=yellow><font face="times new roman"color="black">30/40 <td bgcolor=yellow><font face="times new roman"color="black">x<tr> <td bgcolor=yellow><font face="times new roman"color="black">42/50 <td bgcolor=yellow><font face="times new roman"color="black">40/50 <td bgcolor=yellow><font face="times new roman"color="black">x<tr> <td bgcolor=yellow><font face="times new roman"color="black">30/50 <td bgcolor=yellow><font face="times new roman"color="black">30/50 <td bgcolor=yellow><font face="times new roman"color="black">x</table><td bgcolor=gold colspan=1><font face="Hancock"color="black">Theory total <td bgcolor=gold colspan=1><font face="Hancock"color="black">Practical <td bgcolor=gold colspan=1><font face="Hancock"color="black">Total<TR> <TD bgcolor=lime><font face="BernhardMod BT"color="red">Hindi <TD bgcolor=white colspan=1><font face="BernhardMod BT"color="black">100 <td bgcolor=white rowspan=1><font face="BernhardMod BT"color="black">33 <TD bgcolor=white><font face="BernhardMod BT"color="black">74/100 <TD bgcolor=white><font face="BernhardMod BT"color="black">x <TD bgcolor=lime><font face="BernhardMod BT"color="red">74<TR> <TD bgcolor=lime><font face="BernhardMod BT"color="red">English <TD bgcolor=white><font face="BernhardMod BT"color="black">100 <td bgcolor=white><font face="BernhardMod BT"color="black">33
  14. 14. <TD bgcolor=white><font face="BernhardMod BT"color="black">72/100 <TD bgcolor=white><font face="BernhardMod BT"color="black">x <TD bgcolor=lime><font face="BernhardMod BT"color="red">74<TR> <TD bgcolor=lime><font face="BernhardMod BT"color="red">Science <TD bgcolor=white><font face="BernhardMod BT"color="black">100 <td bgcolor=white><font face="BernhardMod BT"color="black">33 <TD bgcolor=white><font face="BernhardMod BT"color="black">58/82 <TD bgcolor=white><font face="BernhardMod BT"color="black">20/20 <TD bgcolor=lime><font face="BernhardMod BT"color="red">78<TR> <TD bgcolor=lime><font face="BernhardMod BT"color="red">Sanskrit <TD bgcolor=white><font face="BernhardMod BT"color="black">100 <td bgcolor=white><font face="BernhardMod BT"color="black">33 <TD bgcolor=white><font face="BernhardMod BT"color="black">82/100 <TD bgcolor=white><font face="BernhardMod BT"color="black">x <TD bgcolor=lime><font face="BernhardMod BT"color="red">82<TR> <TD bgcolor=lime><font face="BernhardMod BT"color="red">S.Science <TD bgcolor=white><font face="BernhardMod BT"color="black">100 <td bgcolor=white><font face="BernhardMod BT"color="black">33 <TD bgcolor=white><font face="BernhardMod BT"color="black">60/100 <TD bgcolor=white><font face="BernhardMod BT"color="black">x <TD bgcolor=lime><font face="BernhardMod BT"color="red">60<TR> <td bgcolor=gold colspan=4><font face="Charlesworth"color="red">RESULT-Passed<br> Totel <td bgcolor=gold><font face="Charlesworth"color="red">356/500 <td bgcolor=gold colspan=2><font face="Charlesworth"color="red">Division-First<br>Checked by.......</html></head> LinksLinks:- 1. Link to a Website 2. Link to a Webpage 3. Link within a webpage 1. Link to a Website:- For linking we use Anchor Element(<a>……</a>)Syntax:- <a href= “URL with Protocol”> Sample</a> Ex:-<html><head>
  15. 15. <title>link</title></head><body><a href=http://www.yahoo.com>yahoo</a></body></html>In this example when we click on yahoo than yahoo.com open. 2. Link to a Webpage:- We link two webpage by Text and Image. Syntax:- <a href= “URL of Page”> Go to File a.html</a> Ex:-<body><a href= “a.html”> Go to File a.html </a>> </body 3. Link within a webpage:- Ex:-<html><body>Top<br><a name= “top”></a><a href=#top>Top</a><a href=#middle>Middle</a><a href=#bottom>Bottom</a><br><br><br><br><br><br><br><br><br>Middle<br><a name= “middle”></a><a href=#top>Top</a><a href=#middle>Middle</a><a href=#bottom>Bottom</a><br><br><br><br><br><br><br><br><br>Bottom<br><a name= “bottom”></a><a href=#top>Top</a><a href=#middle>Middle</a><a href=#bottom>Bottom</a></body></html>

×