HTML Tags and CSS Property Add-ons
advertisement
HTML Tags and CSS Property Add-ons HTML Tags What you want Tag Explanation Example Basic HTML webpage <html> <head> <title> <body> Basic skeleton tags for creating a simple webpage <html> <head><title>Frank’s Webpage</title></head> <body> your webpage information </body> </html> Paragraphs <p></p> Paragraph tag add space before and after the paragraph <p>This is a paragraph1</p> <p>This is paragraph2</p> This is paragraph1 This is paragraph2 Line Break <br> Used to break a line word1<br>word2 or adds a carriage return at the end of a word1 line word2 Creating Headlines <h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6> Used to introduce a new topic or at a title subtitle to a webpage <h1>The largest Heading </h1> <h2> 2nd largest heading</h2> <h3> 3rd largest heading</h3> <h4> 4th largest heading</h4> <h5> 5th largest heading</h5> <h6>The smallest Heading</h6> The largest Heading 2nd largest heading 3rd largest heading 4th largest heading 5th largest heading The smallest Heading font <font></font> Used to change the font style of text <font style=”font-weight:bold”>My bolded text</font> My bolded text Horizontal Rule <hr> Adds a horizontal line Hi <hr> There Hi __________________________ There Unordered List <ul></ul> Add an unordered, bulleted list <ul> <li>first item <li>second item <li>third item </ul> ● ● ● Ordered list <ol></ol> Add an ordered, numbered list first item second item third item <ol> <li>first item <li>second item <li>third item </ol> 1. first item 2. second item 3. third item Image <img Adds an image src=”filename. extension”> <img src=”roses.jpg” alt=”red rose” width=150 height=150 align=”top”> hyperlink <a href=”website address”> <a href=”http://www.google.com”>google website</a> Add an active hyperlink google website hyperlink that opens in different browser window <a href=”website address” target=”_blan k”> Add an active hyperlink <a href=“http://www.yahoo.com” target=“_blank”> Yahoo! </a> Yahoo! after you click Yahoo! it opens it in a different browser window CSS Properties Property Value Add-on for these tags Example font-weight bold <font><p><h1> through <h6> <font style=”fontweight:bold”>Wheeler</font > Wheeler font-style italic <font><p><h1> through <h6> <font style=”fontstyle:italic”>sneakers</font > sneakers text-align left | right | center <p><h1> through <h6> <p style=”textalign:right”>This is my paragraph</p> This is my paragraph text-decoration underline <font><p><h1> through <h6> <font style=”textdecoration:underline”>clev er</font> clever font-size x-small | small | medium | large | x-large | xx-large <font><p> <p style=”font-size:xsmall”>wildcat nation</p> wildcat nation width number(in pixels) or % <hr> <hr style=”width:150”> ___________ height number(in pixels) <hr> <hr style=”height:200”> color color name or hexidecimal color number <font><p><h1> through <h6><body> <font style=”color:blue”>name</f ont> background-color color name or hexidecimal color number <body> <body style=”backgroundcolor:red”> </body> align left | right | center <hr> <hr style=”align:center”>
