HTML BEGINNING TAGS. HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html>

Size: px

Start display at page:

Download "HTML BEGINNING TAGS. HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html>"

Heather Ross
6 years ago
Views:

1 HTML BEGINNING TAGS HTML Structure <html> <head> <title> </title> </head> <body> Web page content </body> </html> Structure tags: Tags used to give structure to the document. <html> <head> <meta> <title> <link> <body> Text tags: These block level elements are always formatted with a line break before and after the element. <blockquote> <h1> thought <h6> <div> <li> <p> Text tags: Inline styles affect the appearance of text. Inline means they can be applied to a string of characters within a block element without line breaks. <b> <big> <cite> <code> <em> <font> (deprecated) <i> <kbd> <pre> <small> <span> <strong> <sub> <sup>

2 List tags: <dl> <dd> <dt> <li> Spacing and positioning tags give authors control over the line breaks, alignment, and spacing within an HTML document. <br /> <center> <pre> <table> (<tr>, <td>) Linking tags are used to create links from one document to another. <a> <link> (typically used for linking style sheets) <map> Table tags are used to create and format tables. <table> <tr> <td> Frame tags <frame> <frameset> <noframes> Form tags are used to define forms and their elements. <button> <form> <input> (type=button checkebox hidden radio submit text) <textarea> <select> Logical or content based styles describe the enclosed text s meaning/content and leave rendering of tag to the browser. <cite> <code> <div> <em> <kbd> <span> <strong>

3 1. Background color tag: <body bgcolor="#ffffff"> </body> or use 16 reserve words such as: <body bgcolor= red"> </body> <body background="backgroundphoto.jpeg" bgcolor="#ffffff" text="000000" link="blue" vlink="black" alink="red"> </body> background sets the background image bgcolor sets the background color text sets the text color Link sets the color of hyperlinks Vlink sets the color of visited links Alink sets the color of active links Note: It is preferable to set style attributes using style sheets 2. Title tag: <title>this text will display at the top of the screen and be used for bookmarks or favorites</title> 3. Header Tag (range in size from 1 largest to 6 smallest) <h1>this text will be a main heading</h1> <h2>this text is a level 2 sub heading</2> 4. Center Tag (Deprecated tags and attributes that have been replaced by other, newer, HTML constructs but they are still often used.): <center>this text will be put in the center of the screen</center> 5. Bold Tag: <b>this text will be bold</b> 6. Fonts (Deprecated tags and attributes that have been replaced by other, newer, HTML constructs but they are still often used.) Font size: <font size= 4 >Hello, this text will display as font size 4</font> Font color :< font color ="red">hello, this text will display as color red</font> Font Face: <font face="arial">hello, this text will display as a font face of Aria</font> 7. Combine attributes: <font size= 4 color ="red" face="arial">hello, this text will display as size 4, the color red, and with an Arial font face</font> 8. Horizontal Rule: <hr /> Horizontal rule with styles set: <hr style="width: 350px; border color:#cccccc; border style: ridge" /> 9. Paragraph tag: <p></p> 10. Line Break tag: <br />

4 11. Ordered List: <li>topic 1</li> <li>topic 2</li> <li>topic 3</li> 12. Unordered List: <li>topic 1</li> <li>topic 2</li> <li>topic 3</li> </ul> 13. Nested ordered and unordered lists: <li> Topic 1</li> <li>subtopic 1</li> <li>subtopic 1a</li> <li>subtopic 1b</li> <li>subtopic 2</li> </ul> <li> Topic 2</li> <li> Topic 3</li> 14. Anchor tag or "link to" tag: <a href = "URL/filename">Visible text on Web Page</a> <a href = " text on Web Page</a> 15. Anchor tag or "link to" tag is used in conjunction with one another, the name and anchor tags allow you to link to specific sections within a document. <a href = " URL/filename#sectionTitle">Link to a specific section of a Web page</a> <a name="topica"> 16. Mail to: <a href ="mailto: address">your Name</a> Example: <a href="mailto:gibbsw@duq.edu">bill Gibbs</a>

5 17. Image tag: <img src ="filename.gif" width= 25 height= 46 alt= the text will show up if the image does not display /> 18. Span tag: <span style="font family: Verdana; font size: 15px"> Text between the beginning and ending span tag will be set to Verdana with a font size of 15 PX. </span> 19. Div tag: <div align="center">this text will be centered on the screen. </div> 20. Tables (the table below has three cells/columns and one row): <Table border = 1 cellspacing= 25 cellpadding= 25 > <tr> <td>cell one</td> <td>cell two</td> <td>cell three</td> </tr> </table> 21. Add emphasis : <em> William J. Gibbs, 2003</em> 22. Copyright symbol : 23. Non breaking space : 24. Comments: <! Items between the beginning and ending comment tags do not appear on the Web page. >

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS

HTML TAG SUMMARY HTML REFERENCE 18 TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES TAG/ATTRIBUTE DESCRIPTION PAGE REFERENCES MOST TAGS MOST TAGS CLASS Divides tags into groups for applying styles 202 ID Identifies a specific tag 201 STYLE Applies a style locally 200 TITLE Adds tool tips to elements 181 Identifies the HTML version