Published on

A complete HTML (beginner's ) tour

Published in: Education
1 Comment
No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide


  2. 2. By : CHARU GUPTA
  3. 3. INDEX <ul><li>Introduction to HTML </li></ul><ul><li>2. Importance of HTML </li></ul><ul><li>3. Understanding HTML elements </li></ul><ul><li>4. Overall structure of an HTML document </li></ul><ul><li>5. Creating list & inserting images </li></ul><ul><li>6. Hyperlinks & anchors </li></ul><ul><li>7. Conclusion </li></ul>
  4. 4. Introduction to HTML <ul><li>HTML = H yper T ext M arkup L anguage </li></ul><ul><li>HYPERTEXT – An ordinary text that has some ‘extra’ features such as formatting, images, multimedia etc. </li></ul><ul><li>MARKUP - process of adding ‘extra’ features to ordinary text. </li></ul><ul><li>LANGUAGE - Means it has its own syntax, slang and rules for proper communication. </li></ul>
  5. 5. Short History <ul><li>Initially SGML (Standard Generalised Mark-up Language) – A high level language was used by Department of Defense (DoD). </li></ul><ul><li>Later HTML developed as a subset of SGML. </li></ul><ul><li>Advantages of HTML: </li></ul><ul><li>-- simple </li></ul><ul><li>-- Best suited for internet transmission. </li></ul><ul><li>-- lets you create page that can be read on web. </li></ul>
  6. 6. Tools for Web Publishing <ul><li>The most basic element of any HTML page is ASCII text. </li></ul><ul><li>HTML pages, while they include the .htm or .html file extensions, are simply ASCII text files. </li></ul><ul><li>HTML Editor- Any program that generates ASCII text files. </li></ul><ul><li>e.g.: A word processor or Microsoft word. </li></ul>
  7. 7. Importance of HTML <ul><li>1. Used to display any type of document on the host computer. </li></ul><ul><li>2. A versatile language and can be used on any platform. </li></ul><ul><li>3. Used to make the text look attractive. </li></ul><ul><li>4. Can link one document with another. </li></ul>
  8. 8. Steps to Creating an HTML Document <ul><li>Open a text editor. </li></ul><ul><li>Create your HTML document </li></ul><ul><ul><ul><li>Head - not displayed with body </li></ul></ul></ul><ul><ul><ul><li>Body </li></ul></ul></ul><ul><li>Save the HTML (extension of .htm or .html) </li></ul><ul><li>Display your HTML document in WWW browser window (Open File rather than Open Location). </li></ul><ul><li>Check your work and modify as necessary. </li></ul><ul><li>Place it on the Web. </li></ul>
  9. 9. NOTE:- <ul><li>If we create an HTML page in a word processor THEN we use the Save As command to save it as an ASCII text file. </li></ul><ul><li>For checking on the appearance of the web page we have created we need a web browser. </li></ul><ul><li>A web browser should have the ability to load, locate pages from the hard drive. </li></ul>
  10. 10. Introduction to HTML <ul><li>A web page is made up of elements, each of which is defined by an HTML code or tag. </li></ul><ul><li>Document Tags :- The tags that are required for every HTML page we create. </li></ul><ul><li>HTML document has two distinct parts: </li></ul><ul><li>1. A Head </li></ul><ul><li>2. A Body </li></ul><ul><li>Between these two tags, we enter the rest of text and graphics. </li></ul>
  11. 11. Understanding Tags <ul><li>The HTML tags include < and > symbol on either side of the tag’s command. </li></ul><ul><li>If the symbols are not used then the browser will assume the commands as text. </li></ul><ul><li>HTML elements can be categorized as : </li></ul><ul><li>Container elements </li></ul><ul><li>Empty elements </li></ul>
  12. 12. HOW TAGS WORK?? <ul><li>The first part of the tag <tag name> turns the tag on. </li></ul><ul><li>The ending part of the tag, </tag name>, contains the &quot;/&quot; slash character. </li></ul><ul><li>This &quot;/&quot; slash tells a WWW browser to stop tagging the text. Many HTML tags are paired this way. Think of the tag as a container. </li></ul><ul><li>If you forget the backslash, a WWW browser will continue the tag for the rest of the text in your document,producing undesirable results. </li></ul>
  13. 13. HTML Element <ul><li>A container element. </li></ul><ul><li>Identifies the document as an HTML document. </li></ul><ul><li>The <HTML> element delimits the beginning and end of HTML document. </li></ul><ul><li>Contains only the <HEAD> and <BODY> elements. </li></ul><ul><li>Eg. <HTML> </li></ul><ul><li>: </li></ul><ul><li>: </li></ul><ul><li></HTML> </li></ul>
  14. 14. HEAD Element <ul><li>A container element. </li></ul><ul><li>Contains information about the document. </li></ul><ul><li>TITLE element is included in HEAD element. </li></ul><ul><li>-> TITLE element is a container element. </li></ul><ul><li>->used to provide title of the document. </li></ul><ul><li>Eg. </li></ul><ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> This is my first page </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li></HTML> </li></ul>
  15. 15. BODY Element <ul><li>A container element. </li></ul><ul><li>The BODY element contains all the text and images that make up the page. It also contains HTML elements that provide the control and formatting of the page. </li></ul><ul><li>Eg: <BODY> </li></ul><ul><ul><ul><li>------- </li></ul></ul></ul><ul><ul><ul><li>------- </li></ul></ul></ul><ul><ul><ul><li></BODY> </li></ul></ul></ul>
  16. 16. ATTRIBUTES OF BODY ELEMENT <ul><li>~ Background </li></ul><ul><li>~Bgcolor </li></ul><ul><li>~size </li></ul><ul><li>~font </li></ul><ul><li>~color </li></ul><ul><li>~Left margin </li></ul><ul><li>~Top margin….etc </li></ul><ul><li>The above mentioned attributes are explained in the next section. </li></ul>
  17. 17. SYNTAX <ul><li>1. Background: </li></ul><ul><li> <BODY BACKGROUND =“figure.jpg”> </li></ul><ul><li> ------- </li></ul><ul><li> </BODY> </li></ul><ul><li>2. Bgcolor : </li></ul><ul><li> <BODY BGCOLOR=“RED”> </li></ul><ul><li> -------- </li></ul><ul><li> </BODY> </li></ul><ul><li>3. Leftmargin: </li></ul><ul><ul><ul><ul><li><BODY LEFTMARGIN= VALUE> </li></ul></ul></ul></ul><ul><ul><ul><ul><li>-------------- </li></ul></ul></ul></ul><ul><ul><ul><ul><li></BODY> </li></ul></ul></ul></ul><ul><ul><ul><ul><li>Where, value is in pixels. </li></ul></ul></ul></ul>
  18. 18. Conti… <ul><li>4. Topmargin: </li></ul><ul><li><BODY TOPMARGIN=VALUE> </li></ul><ul><li>-------- </li></ul><ul><li></BODY> </li></ul><ul><li>5.Size: </li></ul><ul><li><FONT SIZE = VALUE> </li></ul><ul><li>Where, Default value=3 </li></ul><ul><li>Valid range= 1-7 </li></ul><ul><li>6. Color: This attribute changes the colour of the text that will appear on screen. </li></ul><ul><li>Eg. <BODY> </li></ul><ul><li><FONT SIZE=“5” COLOR=“RED”> </li></ul><ul><li> </FONT> </li></ul><ul><li></BODY> </li></ul>
  19. 19. WORKING IT OUT
  20. 20. BGCOLOR <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> WELCOME TO OUR SITE </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY BGCOLOR =&quot;SILVER&quot;> </li></ul><ul><li><H1> MY FIRST HTML CODE </H1> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  21. 21.
  22. 22. FONT SIZE EXAMPLE <ul><li><HTML> </li></ul><ul><li><BODY> </li></ul><ul><li>THIS TEXT IS WRITTEN IN FONT SIZE 3. </li></ul><ul><li><FONT SIZE =&quot;+2&quot;> </li></ul><ul><li>THIS TEXT IS WRITTEN IN FONT SIZE 5. </li></ul><ul><li></FONT> </li></ul><ul><li><FONT SIZE = &quot;7&quot;> </li></ul><ul><li>THIS TEXT IS WRITTEN IN FONT SIZE 7. </li></ul><ul><li></FONT> </li></ul><ul><li><FONT SIZE =&quot;+12&quot;> </li></ul><ul><li>THIS TEXT IS ASLO WRITTEN IN FONT SIZE 7 'COZ ITS VALUE IS OUT OF THE RANGE. </li></ul><ul><li></FONT> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  23. 23.
  24. 24. COLOR TESTING <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> COLOR TESTING </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY> </li></ul><ul><li><FONT SIZE=&quot;5&quot; COLOR=&quot;RED&quot;> </li></ul><ul><li>THIS TEXT IS WRITTEN IN FONT SIZE 5 AND IN RED COLOR. </li></ul><ul><li></FONT> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  25. 25.
  26. 26. LEFT MARGIN <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> TESTING THE LEFT MARGIN </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY LEFT MARGIN = “45&quot;> </li></ul><ul><li>LET US SET LEFT MARGIN. </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul><ul><li>The above example will give an output, where the text between the <BODY> element will be indented 45 pixels from the left hand side of the page. </li></ul>
  27. 27.
  28. 28. TOP MARGIN <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> TESTING THE TOP MARGIN </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY TOPMARGIN = &quot;55&quot;> </li></ul><ul><li>LET US SET TOPMARGIN. </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul><ul><li>The above example will give an output, where the text is 55 pixels away from the top of the page. </li></ul>
  29. 29.
  30. 30. HEADING Element <ul><li>HTML defines six levels of heading. </li></ul><ul><li>The heading element is written as: </li></ul><ul><li><Hn>………………………</Hn> </li></ul><ul><li>Where n -  level of heading and can take values from 1 to 6. </li></ul><ul><li>H1 --  most prominent heading ,while </li></ul><ul><li>H6 --  least prominent heading. </li></ul><ul><li>Headings are usually displayed in bolder and larger font than the normal text. </li></ul><ul><li>NOTE: (From the example next)- An extra line is generally inserted above and below the heading. </li></ul>
  31. 31. HTML CODE <ul><li><HTML> </li></ul><ul><li><BODY> </li></ul><ul><li><H1> HEADING ONE</H1> </li></ul><ul><li> <H2>HEADING TWO</H2> </li></ul><ul><li> <H3>HEADING THREE</H3> </li></ul><ul><li><H4>HEADING 4 </H4> </li></ul><ul><li><H5> HEADING FIVE</H5> </li></ul><ul><li><H6>HEADING SIX</H6> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  32. 32.
  33. 33. PARAGRAPH Element <ul><li>The PARAGRAPH Element <P> indicates a paragraph. </li></ul><ul><li>This element is used to insert a line break with extra space in the beginning. </li></ul><ul><li>The paragraph can be aligned by using the ALIGN attribute. </li></ul><ul><li>The ALIGN = LEFT/CENTER/RIGHT attribute can be added to the <H1> through to <H6> elements. </li></ul><ul><li>SYNTAX: </li></ul><ul><li><P> ……………………………..</P> </li></ul>
  34. 34. HTML CODE <ul><li><HTML> </li></ul><ul><li><BODY> </li></ul><ul><li><P> THIS IS FIRST PARAGRAPH </P> </li></ul><ul><li><P ALIGN=&quot;CENTER&quot;> THIS IS SECOND PARAGRAPH WHICH IS CENTER ALIGNED </li></ul><ul><li></P> </li></ul><ul><li><P ALIGN =&quot;RIGHT&quot;> THIS IS THIRD PARAGRAPH WHICH IS RIGHT ALIGNED </li></ul><ul><li></P> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  35. 35.
  36. 36. STYLE TAGS <ul><li>B (BOLD) Syntax: <B> ---------- </B> </li></ul><ul><li>I (ITALIC) Syntax: <I> ----------- </I> </li></ul><ul><li>3. SUB (Subscript) </li></ul><ul><li> Syntax: <SUB> ---------- </SUB> </li></ul><ul><li>4. SUP (Super script) </li></ul><ul><li> Syntax: <SUP> ---------- </SUP> </li></ul>
  37. 37. HTML code for BOLD & SUBSCRIPT <ul><li><HTML> </li></ul><ul><li><BODY> </li></ul><ul><li><H1 ALIGN=&quot;CENTER&quot;><B> SOME CHEMICAL FORMULAS</B></H1> <BR> </li></ul><ul><li> <B>CO<SUB>2</SUB></B> </li></ul><ul><li><B>H<SUB>2</SUB>O<BR></B> </li></ul><ul><li>H<SUB>2</SUB>SO<SUB>4</SUB> </li></ul><ul><li><BODY> </li></ul><ul><li><HTML> </li></ul>
  38. 38.
  39. 39. HTML code for ITALIC & SUP <ul><li><HTML> </li></ul><ul><li><BODY> </li></ul><ul><li><H1 ALIGN=&quot;CENTER&quot;><B> <I>SOME MATHEMATICAL FORMULAS</I></B></H1> <BR> </li></ul><ul><li>(A+B) <SUP>2</SUP>=A<SUP>2</SUP> + B<SUP>2</SUP> + 2AB<BR> </li></ul><ul><li>(A-B) <SUP>2</SUP>=A<SUP>2</SUP> + B<SUP>2</SUP> - 2AB </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>
  40. 40.
  41. 41. Overall structure of an HTML document <ul><li><html> </li></ul><ul><li><head> </li></ul><ul><li><title>The Title of the Document</title> </li></ul><ul><li></head> </li></ul><ul><li><body bgcolor=&quot;white&quot;> </li></ul><ul><li>... </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul>
  43. 43. Making Lists <ul><li>HTML supports several types of list elements that should be included within the BODY element of the document. </li></ul><ul><li>The tag used to indicate an item is LI. </li></ul><ul><li><LI> tag is an empty element. </li></ul><ul><li>List can be of two types: </li></ul><ul><li>Ordered list </li></ul><ul><li>Unordered list </li></ul>
  44. 44. Conti… <ul><li>Ordered list(OL): </li></ul><ul><li>Syntax: </li></ul><ul><li><OL START =“VALUE” </li></ul><ul><li>TYPE= “A”/“a”/”i”/”I”/”1”> </li></ul><ul><li>---------- </li></ul><ul><li></OL> </li></ul><ul><li>Where, </li></ul><ul><li>start=“value” indicates the starting number for the list. </li></ul><ul><li>Type attribute defines the type of numbering sequence. </li></ul>
  45. 45. Conti… <ul><li>Unordered list(UL): </li></ul><ul><li>Syntax: </li></ul><ul><li><UL TYPE = “CIRCLE”/”DISC”/”SQUARE”> </li></ul><ul><li>-------- </li></ul><ul><li></UL> </li></ul><ul><li>TYPE attribute can be one of the following: </li></ul><ul><li>~ CIRCLE: Specifies a bullet. </li></ul><ul><li>~ DISC: Specifies a solid round bullet. </li></ul><ul><li>~ SQUARE: Specifies a square bullet. </li></ul>
  46. 46. Unordered List <ul><li><html> </li></ul><ul><li><body> </li></ul><ul><li><h4>An Unordered List:</h4> </li></ul><ul><li><ul type= “circle”> </li></ul><ul><li><li>Coffee </li></ul><ul><li><li>Tea </li></ul><ul><li><li>Milk </li></ul><ul><li></ul> </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul><ul><li>Output </li></ul><ul><li>An Unordered List: </li></ul><ul><li>Coffee </li></ul><ul><li>Tea </li></ul><ul><li>Milk </li></ul>
  47. 47.
  48. 48. Ordered List <ul><li><html> </li></ul><ul><li><body> </li></ul><ul><li><h4>An Ordered List:</h4> </li></ul><ul><li><ol start=“1” type= “1”> </li></ul><ul><li><li>Coffee </li></ul><ul><li><li>Tea </li></ul><ul><li><li>Milk </li></ul><ul><li></ol> </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul><ul><li>Output </li></ul><ul><li>An Ordered List: </li></ul><ul><li>1.Coffee </li></ul><ul><li>2.Tea </li></ul><ul><li>3.Milk </li></ul>
  49. 49.
  50. 50. INSERTING IMAGES <ul><li>IMG Element : </li></ul><ul><li>The IMG tag specifies an image to be displayed in an HTML document. </li></ul><ul><li>It is an empty element. </li></ul><ul><li>Syntax: </li></ul><ul><li><IMG </li></ul><ul><li>SRC = IMAGE_URL </li></ul><ul><li>ALIGN= ALIGNMENT </li></ul><ul><li>BORDER= BORDER WIDTH_VALUE </li></ul><ul><li>HEIGHT= HEIGHT_VALUE </li></ul><ul><li>WIDTH= WIDTH_VALUE </li></ul><ul><li>ALT = TEXT </li></ul><ul><li>> </li></ul>
  51. 51. DESCRIPTION <ul><li>SRC : The value is the URL of the image to be displayed. </li></ul><ul><li>Eg; <IMG SRC = “CLOUDS.GIF”> </li></ul><ul><li>ALIGN : Used to determine the vertical alignment of the text adjacent to the image. </li></ul><ul><li>By default navigator uses BOTTOM. </li></ul><ul><li>Eg: <IMG SRC = “CLOUDS.GIF” ALIGN = “LEFT”> </li></ul><ul><li><IMG SRC = “CLOUDS.GIF” ALIGN = “RIGHT”> </li></ul><ul><li><IMG SRC = “CLOUDS.GIF” ALIGN = “BOTTOM”> </li></ul><ul><li><IMG SRC = “CLOUDS.GIF” ALIGN = “TOP”> </li></ul><ul><li>BORDER : Specifies the width of a border around the image. The value must be a positive integer. </li></ul><ul><li>Eg: <IMG SRC = CLODS.GIF” BORDER = “3”> </li></ul>
  52. 52. CONTI… <ul><li>HEIGHT : Specifies the height of an image either in the form of an integer or as a percentage of the height of the window. </li></ul><ul><li>Eg: <IMG SRC =“ CLOUDS.GIF” BORDER =“3” HEIGHT = 20%> </li></ul><ul><li>WIDTH : Specifies the width of an image either in the form of an integer or as a percentage of the width of the window. </li></ul><ul><li>Eg: <IMG SRC= “SKY.GIF” BORDER= “3” HEIGHT= 20% WIDTH= 50%> </li></ul><ul><li>ALT : Used to give alternate text that will be displayed in place of the image. </li></ul><ul><li>USAGE: This is required when the user needs to stop the display of images while retrieving a document in order to make the retrieval faster or when the browser does not support graphics. </li></ul><ul><li>Eg: <IMG SRC=“SKY.GIF” ALT= “CLOUDS IN THE SKY”> </li></ul>
  53. 53. EXAMPLE <ul><li><html> </li></ul><ul><li><body> </li></ul><ul><li><img </li></ul><ul><li> border=&quot;0&quot; </li></ul><ul><li>src=&quot;/images/google.jpg&quot; </li></ul><ul><li>width=&quot;304&quot; </li></ul><ul><li>height=&quot;228“ </li></ul><ul><li> > </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul>
  54. 54.
  56. 56. INTRODUCTION <ul><li>ANCHOR ELEMENT : </li></ul><ul><li>The Anchor element <A> marks the text as a hypertext link, that the user can click to display an anchor as a document. </li></ul><ul><li>The <A> or anchor tag is used for creating hypertext links. This tag is a container tag and requires </A> to mark the end of the text, images. </li></ul><ul><li>Syntax: </li></ul><ul><ul><ul><li><A HREF =“URL” > TEXT DESCRIBING LINK </A> </li></ul></ul></ul><ul><ul><ul><li>DESC: </li></ul></ul></ul><ul><ul><ul><li>If the above statement is displayed in a browser, the words TEXT DESCRIBING LINK would appear underlined and in another color to indicate that clicking that text starts the execution of the hypertext link. </li></ul></ul></ul>
  57. 57. CONTI… <ul><li>HREF </li></ul><ul><li>The HREF attribute make the text enclosed between the opening <A> and closing </A> anchor elements as hypertext . </li></ul><ul><li>If the user selects this hypertext the control moves to the document specified by the value of the attribute. </li></ul><ul><li>Eg: <A HREF = “SHAPE.HTM”> CLICK HERE </A> </li></ul><ul><li>In the above example selecting the hypertext CLICK HERE takes the reader to the document named SHAPE.HTM </li></ul><ul><li>SELECTION LINKS : Create links to other parts of the same document in which link appears. </li></ul><ul><li>This requires two instances of the anchor tag- one that serves as a hypertext link and another that acts as a reference point for that link. </li></ul>
  58. 58. CONTI…. <ul><li>FOR EXAMPLE: </li></ul><ul><li><A HREF = “#SECTION-NAME”> Link to another section of same document </A> </li></ul><ul><li><A NAME = “ SECTION-NAME”> New Section </A> </li></ul><ul><li>The anchor tag that creates the hyperlink is similar to the anchor tag that we have done previously. </li></ul><ul><li>The only difference is that it begins with (#) sign in HREF text. </li></ul><ul><li>This sign tells the anchor that it is looking for a section within the current document. </li></ul><ul><li>The NAME attribute is used to create the actual section within the current HTML document. </li></ul><ul><li>NAME is like an internal reference; w/o it, though, the link would not work. The NAME text is case sensitive. </li></ul>
  60. 60. Source Document <ul><li><html> </li></ul><ul><li><head> </li></ul><ul><li><title>Source Document</title> </li></ul><ul><li></head> </li></ul><ul><li><body> </li></ul><ul><li><a href=&quot;target.html#danger&quot;> </li></ul><ul><li>Better look here </li></ul><ul><li></a> </li></ul><ul><li></body> </li></ul><ul><li></html </li></ul>
  61. 61. Target Document <ul><li><html> </li></ul><ul><li><head> </li></ul><ul><li><title>Target Document</title> </li></ul><ul><li></head> </li></ul><ul><li><body> </li></ul><ul><li>.... </li></ul><ul><li>… . </li></ul><ul><li><a name=&quot;danger&quot;> </a> </li></ul><ul><li><h2> Chapter 17: Dangerous Shell Commands </li></ul><ul><li></h2> </li></ul><ul><li>Never execute a shell command that inadvertently changes </li></ul><ul><li>all vowels to the character 'x'. </li></ul><ul><li></body> </li></ul><ul><li></html </li></ul>
  62. 62.
  63. 63. COMMON TAGS USED <ul><li><HTML> </HTML> Opens and closes the HTML document. </li></ul><ul><li><title> </title> This is the title of your page and will appear at the top of your browser’s window. </li></ul><ul><li><h1> </h1> <h5> </h5> Header sizes for titles and larger text formats. Or specify font size: <font size=“4”> </font> </li></ul><ul><li><img src=“filename.gif”> </li></ul><ul><ul><li>Sources an image file and needs no closing tag. </li></ul></ul>
  64. 64. COMMON TAGS USED <ul><li><a href=“filename.html”> Place URL </a> </li></ul><ul><ul><li>Links text or images to the designated file. </li></ul></ul><ul><li><b> text </b> Bold text. </li></ul><ul><li><i> text </i> Italic text. </li></ul><ul><li><u> text </u> Underline text. </li></ul><ul><li><br> (no closing) Line break. </li></ul><ul><li><hr> (no closing) Horizontal line. </li></ul>
  65. 65. POINTS TO REMEMBER <ul><li>There are two kinds of HTML elements used to construct an HTML document. These are container and empty elements. </li></ul><ul><li>An HTML document should start with a container HTML tag and end with a closing HTML tag. </li></ul><ul><li>The HTML tags are not case sensitive. </li></ul><ul><li>The image to be copied should have an extension GIF or JPEG. </li></ul><ul><li>The items in a list will be displayed in a bulleted form if TYPE attribute is not given. </li></ul>
  66. 66. POINTS TO REMEMBER <ul><li>There are five ways in which we can number the list. </li></ul><ul><li>The IMG tag specifies an image to be displayed in a HTML document. </li></ul><ul><li>The extension of the image file should be either GIF or JPEG. </li></ul><ul><li>The image can be aligned as- left, right, top, bottom margin. </li></ul><ul><li>An Anchor element may not enclose another Anchor element. </li></ul><ul><li>An image can also be used as an hyperlink. </li></ul>
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.