and , links with , lists with and , forms with and , and headings with -. Each tag is displayed with its name and a brief code example to demonstrate its appearance in a web browser."> and , links with , lists with and , forms with and , and headings with -. Each tag is displayed with its name and a brief code example to demonstrate its appearance in a web browser."> Address: [go: up one dir, main page] Include Form Remove Scripts Session Cookies Open navigation menuClose suggestionsSearchSearchenChange LanguageUploadSign inSign inDownload free for days0 ratings0% found this document useful (0 votes)2K views32 pagesHTML Tags ChartThe document provides examples of various HTML tags and their usage. It includes tags for text formatting like <b> and <i>, links with <a>, lists with <ul> and <ol>, forms with <form> and <input>, and headings with <h1>-<h6>. Each tag is displayed with its name and a brief code example to demonstrate its appearance in a web browser.Uploaded byRafia Khan BhabhaAI-enhanced descriptionCopyright© Attribution Non-Commercial (BY-NC)We take content rights seriously. If you suspect this is your content, claim it here.Available FormatsDownload as DOCX, PDF, TXT or read online on ScribdDownload nowDownloadSave HTML Tags Chart For LaterDownloadSaveSave HTML Tags Chart For Later0%0% found this document useful, undefined0%, undefinedEmbedSharePrintReport0 ratings0% found this document useful (0 votes)2K views32 pagesHTML Tags ChartThe document provides examples of various HTML tags and their usage. It includes tags for text formatting like <b> and <i>, links with <a>, lists with <ul> and <ol>, forms with <form> and <input>, and headings with <h1>-<h6>. Each tag is displayed with its name and a brief code example to demonstrate its appearance in a web browser.Uploaded byRafia Khan BhabhaAI-enhanced descriptionCopyright© Attribution Non-Commercial (BY-NC)We take content rights seriously. If you suspect this is your content, claim it here.Available FormatsDownload as DOCX, PDF, TXT or read online on ScribdDownload nowDownloadSave HTML Tags Chart For LaterCarousel PreviousCarousel NextDownloadSaveSave HTML Tags Chart For Later0%0% found this document useful, undefined0%, undefinedEmbedSharePrintReportDownload nowDownloadYou are on page 1/ 32SearchFullscreenHTML Tags ChartTo use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. Tag <!-<a <b> <big> <body> Name comment anchor bold Code Example Browser View<!--This can be viewed in the HTML part of a Nothing will show (Tip) document--> <a href="http://www.domain.com/"> Visit Our Site</a> <b>Example</b> Visit Our Site (Tip) Examplebig (text) <big>Example</big> body of <body>The content of your HTML HTML documen page</body> t line breakExample (Tip)Contents of your web page (Tip)<br>The contents of your web The contents of your page<br>The contents of page your page The contents of your web page <center>This will center your contents</center> This will center your contents Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term This is an Example of<center> center<dd><dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> descripti <dt>Definition Term</dt> on <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> <dt>Definition Term</dt> list <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> term <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> emphasis This is an <em>Example</em> of using<dl><dt><em>the emphasis tag <embed> embed object <embed src="yourfile.mid" width="100%" height="60" align="center">using the emphasis tag (Tip)<embed>embed object<embed src="yourfile.mid" autostart="true" hidden="false" loop="false"> <noembed><bgsound src="yourfile.mid" loop="1"></noembed>Music will begin playing when your page is loaded and will only play one time. A control panel will be displayed to enable your visitors to stop the music. Example (Tip)<font> <font> <font>font font font<font face="Times New Roman">Example</font> <font face="Times New Roman" size="4">Example</font> <font face="Times New Roman" size="+3" color="#ff0000">Example</font> <form action="mailto:you@yourdomain.com"> Name: <input name="Name" value="" size="10"><br> Email: <input name="Email" value="" size="10"><br> <center><input type="submit"></center> </form> <h1>Heading 1 Example</h1> <h2>Heading 2 Example</h2> <h3>Heading 3 Example</h3> <h4>Heading 4 Example</h4> <h5>Heading 5 Example</h5> <h6>Heading 6 Example</h6>Example (Tip)Example (Tip)Name: Email: (Tip)<form>form<h1> <h2> <h3> <h4> <h5> <h6>heading 1 heading 2 heading 3 heading 4 heading 5 heading 6<head>heading of HTML <head>Contains elements describing the documen document</head> t horizonta <hr /> l ruleNothing will show<hr>Contents of your web page (Tip)Contents of your web page horizonta <hr width="50%" size="3" /> l rule Contents of your web page Contents of your web page Contents of your web page Contents of your web page<hr><hr>horizonta <hr width="50%" size="3" noshade /> l ruleContents of your web <hr> page horizonta (Internet <hr width="75%" color="#ff0000" size="4" /> l rule Explorer) Contents of your web page <hr> horizonta (Internet <hr width="25%" color="#6699ff" size="6" /> l rule Explorer) Contents of your web page <html> <head> <meta> hypertext <title>Title of your web page</title> markup </head> language <body>HTML web page contents </body> </html> italic image <i>Example</i> <img src="Earth.gif" width="41" height="41" border="0" alt="text describing the image" /> Example 1: <form method=post action="/cgibin/example.cgi"> <input type="text" size="10" maxlength="30"> <input type="Submit" value="Submit"> </form> Example 2: Example 1: (Tip) Contents of your web page<html>Contents of your web page<i> <img>Example (Tip)<input>input field<input>inputExample 2: (Tip)(Internet field Explorer)<form method=post action="/cgibin/example.cgi"> <input type="text" style="color: #ffffff; fontfamily: Verdana; font-weight: bold; font-size: 12px; background-color: #72a4d2;" size="10" maxlength="30"> <input type="Submit" value="Submit"> </form> Example 3: <form method=post action="/cgibin/example.cgi"> <table border="0" cellspacing="0" cellpadding="2"><tr><td bgcolor="#8463ff"><input type="text" size="10" maxlength="30"></td><td bgcolor="#8463ff" valign="Middle"> <input type="image" name="submit" src="yourimage.gif"></td></tr> </table> </form> Example 4: <form method=post action="/cgibin/example.cgi"> Enter Your Comments:<br> <textarea wrap="virtual" name="Comments" rows=3 cols=20 maxlength=100></textarea><br> <input type="Submit" value="Submit"> <input type="Reset" value="Clear"> </form> Example 5: <form method=post action="/cgibin/example.cgi"> <center> Select an option: <select> <option >option 1</option> <option selected>option 2</option> <option>option 3</option> <option>option 4</option> <option>option 5</option> <option>option 6</option> Example 4: (Tip) Example 3: (Tip)<input>input field<input>input fieldExample 5: Tip) Select an option:<input>input field</select><br> <input type="Submit" value="Submit"></center> </form> Example 6: <form method=post action="/cgiExample 6: (Tip) bin/example.cgi"> Select an option:<br> <input type="radio" name="option"> Option 1 Select an option: <input type="radio" name="option" checked> Option 1 Option 2 Option 2 <input type="radio" name="option"> Option 3 <br> Option 3 <br> Select an option:<br> Select an option: <input type="checkbox" name="selection"> Selection 1 Selection 1 <input type="checkbox" name="selection" Selection 2 checked> Selection 2 Selection 3 <input type="checkbox" name="selection"> Selection 3 <input type="Submit" value="Submit"> </form> Example 1: Example 1: (Tip) <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </MENU> <li> list item Example 2: <ol type="i"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> <link> link <head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> o <input>input fieldList item 1 List item 2 List item 3Example 2: i. ii. iii. iv. List item 1 List item 2 List item 3 List item 4<marque <marquee bgcolor="#cccccc" loop="-1" e> scrolling scrollamount="2" width="100%">Example (Internet text Marquee</marquee> Explorer) <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </menu> o (Tip) List item 1 List item 2 List item 3<menu>menu<meta>meta<meta name="Description" content="Description of your site"> Nothing will show (Tip) <meta name="keywords" content="keywords describing your site"> <meta HTTP-EQUIV="Refresh" CONTENT="4;URL=http://www.yourdomain. Nothing will show (Tip) com/"> <meta http-equiv="Pragma" content="nocache"> <meta name="rating" content="General"> <meta name="robots" content="all"> <meta name="robots" content="noindex,follow"> Numbered <ol> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Numbered 1. 2. 3. 4. List item 1 List item 2 List item 3 List item 4<meta> <meta> <meta> <meta> <meta>meta meta meta meta metaNumbered Special Start 5. 6. 7. 8. List item 1 List item 2 List item 3 List item 4<ol>ordered listNumbered Special Start <ol start="5"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Lowercase LettersLowercase Letters a. List item 1 b. List item 2 c. List item 3d. List item 4 <ol type="a"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Letters <ol type="A"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Letters Special Start <ol type="A" start="3"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Lowercase Roman Numerals <ol type="i"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Roman Numerals <ol type="I"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Roman Numerals Special Start VII. VIII. IX. X. List item 1 List item 2 List item 3 List item 4 Capital Letters Special Start C. D. E. F. List item 1 List item 2 List item 3 List item 4 Capital Letters A. B. C. D. List item 1 List item 2 List item 3 List item 4Lowercase Roman Numerals i. ii. iii. iv. List item 1 List item 2 List item 3 List item 4Capital Roman Numerals I. II. III. IV. List item 1 List item 2 List item 3 List item 4Capital Roman Numerals Special Start<ol type="I" start="7"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> <form method=post action="/cgibin/example.cgi"> <center> Select an option: <select> <option>option 1</option> <option selected>option 2</option> <option>option 3</option> <option>option 4</option> <option>option 5</option> <option>option 6</option> </select><br> </center> </form> This is an example displaying the use of the paragraph tag. <p> This will create a line break and a space between lines. Attributes: Example 1:<br> <br> <p align="left"> This is an example<br> displaying the use<br> of the paragraph tag.<br> paragrap <br> h Example 2:<br> <br> <p align="right"> This is an example<br> displaying the use<br> of the paragraph tag.<br> <br> Example 3:<br> <br> <p align="center"> This is an example<br> displaying the use<br><option>listbox optionSelect an option: (Tip)This is an example displaying the use of the paragraph tag. This will create a line break and a space between lines. Attributes: Example 1: This is an example displaying the use of the paragraph tag. Example 2: This is an example displaying the use of the paragraph tag. Example 3: This is an example<p>of the paragraph tag. <small> <strike> <strong> small (text) deleted text <small>Example</small> <strike>Example</strike>displaying the use of the paragraph tag.Example(Tip)Example Examplestrong <strong>Example</strong> emphasis Example 1: <table border="4" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Example 2: (Internet Explorer) <table border="2" bordercolor="#336699" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Example 3: <table cellpadding="2" cellspacing="2" width="100%"> <tr> <td bgcolor="#cccccc">Column 1</td> <td bgcolor="#cccccc">Column 2</td> </tr> <tr> <td>Row 2</td> <td>Row 2</td> </tr> </table>Example 1: (Tip) Column 1 Column 2Example 2: (Tip) Column 1 Column 2<table>tableExample 3: (Tip) Column 1 Row 2 Column 2 Row 2<td>table data<table border="2" cellpadding="2" cellspacing="2" width="100%"><tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> <div align="center"> <table> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr> <td>Row 2</td> <td>Row 2</td> <td>Row 2</td> </tr> <tr> <td>Row 3</td> <td>Row 3</td> <td>Row 3</td> </tr> <tr> <td>Row 4</td> <td>Row 4</td> <td>Row 4</td> </tr> </table> </div>Column 1Column 2<th>table headerColum n1 Row 2 Row 3 Row 4Colum n2 Row 2 Row 3 Row 4Colum n3 Row 2 Row 3 Row 4<title>documen <title>Title of your HTML page</title> t title <table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> table row <td>Column 1</td> <td>Column 2</td> </tr> </table> teletype <tt>Example</tt> underline <u>Example</u> Example 1:<br> unordere <br> d list <ul>Title of your web page will be viewable in the title bar. (Tip)<tr>Column 1Column 2<tt> <u> <ul>ExampleExample Example 1:List item 1<li>List item 1</li> <li>List item 2</li> </ul> <br> Example 2:<br> <ul type="disc"> <li>List item 1</li> <li>List item 2</li> <ul type="circle"> <li>List item 3</li> <li>List item 4</li> </ul> </ul>List item 2Example 2: List item 1 List item 2 o List item 3 o List item 4Major hexadecimal color codesColor Red Turquoise Light Blue Dark Blue Light Purple Dark Purple Yellow Pastel Green Pink Color Code #FF0000 #00FFFF #0000FF #0000A0 #FF0080 #800080 #FFFF00 #00FF00 #FF00FF Color White Light Grey Dark Grey Black Orange Brown Burgundy Forest Green Grass Green Color Code #FFFFFF #C0C0C0 #808080 #000000 #FF8040 #804000 #800000 #808000 #408080Color code chartUse our HTML color picker if you need to choose from an almost infinite variety of colors. Also, if you like a color scheme of a web page view Tip142 for a fantastic tool that can be used to gather that page's color codes.COLOR NAME Black Gray0 Gray18 Gray21 Gray23 Gray24 Gray25 Gray26 Gray27 Gray28 Gray29 Gray30 Gray31 Gray32 Gray34 Gray35 CODE #000000 #150517 #250517 #2B1B17 #302217 #302226 #342826 #34282C #382D2C #3b3131 #3E3535 #413839 #41383C #463E3F #4A4344 #4C4646 COLOR Black Gray0 Gray18 Gray21 Gray23 Gray24 Gray25 Gray26 Gray27 Gray28 Gray29 Gray30 Gray31 Gray32 Gray34 Gray35Gray36 Gray37 Gray38 Gray39 Gray40 Gray41 Gray42 Gray43 Gray44 Gray45 Gray46 Gray47 Gray48 Gray49 Gray50 Gray Slate Gray4 Slate Gray Light Steel Blue4#4E4848 #504A4B #544E4F #565051 #595454 #5C5858 #5F5A59 #625D5D #646060 #666362 #696565 #6D6968 #6E6A6B #726E6D #747170 #736F6E #616D7E #657383 #646D7EGray36 Gray37 Gray38 Gray39 Gray40 Gray41 Gray42 Gray43 Gray44 Gray45 Gray46 Gray47 Gray48 Gray49 Gray50 Gray Slate Gray4 Slate Gray Light Steel Blue4Light Slate Gray Cadet Blue4 Dark Slate Gray4 Thistle4 Medium Slate Blue Medium Purple4 Midnight Blue Dark Slate Blue Dark Slate Gray Dim Gray Cornflower Blue Royal Blue4 Slate Blue4 Royal Blue Royal Blue1 Royal Blue2 Royal Blue3 Deep Sky Blue Deep Sky Blue2#6D7B8D #4C787E #4C7D7E #806D7E #5E5A80 #4E387E #151B54 #2B3856 #25383C #463E41 #151B8D #15317E #342D7E #2B60DE #306EFF #2B65EC #2554C7 #3BB9FF #38ACECLight Slate Gray Cadet Blue4 Dark Slate Gray4 Thistle4 Medium Slate Blue Medium Purple4 Midnight Blue Dark Slate Blue Dark Slate Gray Dim Gray Cornflower Blue Royal Blue4 Slate Blue4 Royal Blue Royal Blue1 Royal Blue2 Royal Blue3 Deep Sky Blue Deep Sky Blue2Slate Blue Deep Sky Blue3 Deep Sky Blue4 Dodger Blue Dodger Blue2 Dodger Blue3 Dodger Blue4 Steel Blue4 Steel Blue Slate Blue2 Violet Medium Purple3 Medium Purple Medium Purple2 Medium Purple1 Light Steel Blue Steel Blue3 Steel Blue2 Steel Blue1#357EC7 #3090C7 #25587E #1589FF #157DEC #1569C7 #153E7E #2B547E #4863A0 #6960EC #8D38C9 #7A5DC7 #8467D7 #9172EC #9E7BFF #728FCE #488AC7 #56A5EC #5CB3FFSlate Blue Deep Sky Blue3 Deep Sky Blue4 Dodger Blue Dodger Blue2 Dodger Blue3 Dodger Blue4 Steel Blue4 Steel Blue Slate Blue2 Violet Medium Purple3 Medium Purple Medium Purple2 Medium Purple1 Light Steel Blue Steel Blue3 Steel Blue2 Steel Blue1Sky Blue3 Sky Blue4 Slate Blue Slate Blue Slate Gray3 Violet Red Violet Red1 Violet Red2 Deep Pink Deep Pink2 Deep Pink3 Deep Pink4 Medium Violet Red Violet Red3 Firebrick Violet Red4 Maroon4 Maroon Maroon3#659EC7 #41627E #737CA1 #737CA1 #98AFC7 #F6358A #F6358A #E4317F #F52887 #E4287C #C12267 #7D053F #CA226B #C12869 #800517 #7D0541 #7D0552 #810541 #C12283Sky Blue3 Sky Blue4 Slate Blue Slate Blue Slate Gray3 Violet Red Violet Red1 Violet Red2 Deep Pink Deep Pink2 Deep Pink3 Deep Pink4 Medium Violet Red Violet Red3 Firebrick Violet Red4 Maroon4 Maroon Maroon3Maroon2 Maroon1 Magenta Magenta1 Magenta2 Magenta3 Medium Orchid Medium Orchid1 Medium Orchid2 Medium Orchid3 Medium Orchid4 Purple Purple1 Purple2 Purple3 Purple4 Dark Orchid4 Dark Orchid Dark Violet#E3319D #F535AA #FF00FF #F433FF #E238EC #C031C7 #B048B5 #D462FF #C45AEC #A74AC7 #6A287E #8E35EF #893BFF #7F38EC #6C2DC7 #461B7E #571B7e #7D1B7E #842DCEMaroon2 Maroon1 Magenta Magenta1 Magenta2 Magenta3 Medium Orchid Medium Orchid1 Medium Orchid2 Medium Orchid3 Medium Orchid4 Purple Purple1 Purple2 Purple3 Purple4 Dark Orchid4 Dark Orchid Dark VioletDark Orchid3 Dark Orchid2 Dark Orchid1 Plum4 Pale Violet Red Pale Violet Red1 Pale Violet Red2 Pale Violet Red3 Pale Violet Red4 Plum Plum1 Plum2 Plum3 Thistle Thistle3 Lavender Blush2 Lavender Blush3 Thistle2 Thistle1#8B31C7 #A23BEC #B041FF #7E587E #D16587 #F778A1 #E56E94 #C25A7C #7E354D #B93B8F #F9B7FF #E6A9EC #C38EC7 #D2B9D3 #C6AEC7 #EBDDE2 #C8BBBE #E9CFEC #FCDFFFDark Orchid3 Dark Orchid2 Dark Orchid1 Plum4 Pale Violet Red Pale Violet Red1 Pale Violet Red2 Pale Violet Red3 Pale Violet Red4 Plum Plum1 Plum2 Plum3 Thistle Thistle3 Lavender Blush2 Lavender Blush3 Thistle2 Thistle1Lavender Lavender Blush Light Steel Blue1 Light Blue Light Blue1 Light Cyan Slate Gray1 Slate Gray2 Light Steel Blue2 Turquoise1 Cyan Cyan1 Cyan2 Turquoise2 Medium Turquoise Turquoise Dark Slate Gray1 Dark Slate Gray2 Dark Slate Gray3#E3E4FA #FDEEF4 #C6DEFF #ADDFFF #BDEDFF #E0FFFF #C2DFFF #B4CFEC #B7CEEC #52F3FF #00FFFF #57FEFF #50EBEC #4EE2EC #48CCCD #43C6DB #9AFEFF #8EEBEC #78c7c7Lavender Lavender Blush Light Steel Blue1 Light Blue Light Blue1 Light Cyan Slate Gray1 Slate Gray2 Light Steel Blue2 Turquoise1 Cyan Cyan1 Cyan2 Turquoise2 Medium Turquoise Turquoise Dark Slate Gray1 Dark slate Gray2 Dark Slate Gray3Cyan3 Turquoise3 Cadet Blue3 Pale Turquoise3 Light Blue2 Dark Turquoise Cyan4 Light Sea Green Light Sky Blue Light Sky Blue2 Light Sky Blue3 Sky Blue Sky Blue2 Light Sky Blue4 Sky Blue Light Slate Blue Light Cyan2 Light Cyan3 Light Cyan4#46C7C7 #43BFC7 #77BFC7 #92C7C7 #AFDCEC #3B9C9C #307D7E #3EA99F #82CAFA #A0CFEC #87AFC7 #82CAFF #79BAEC #566D7E #6698FF #736AFF #CFECEC #AFC7C7 #717D7DCyan3 Turquoise3 Cadet Blue3 Pale Turquoise3 Light Blue2 Dark Turquoise Cyan4 Light Sea Green Light Sky Blue Light Sky Blue2 Light Sky Blue3 Sky Blue Sky Blue2 Light Sky Blue4 Sky Blue Light Slate Blue Light Cyan2 Light Cyan3 Light Cyan4Light Blue3 Light Blue4 Pale Turquoise4 Dark Sea Green4 Medium Aquamarine Medium Sea Green Sea Green Dark Green Sea Green4 Forest Green Medium Forest Green Spring Green4 Dark Olive Green4 Chartreuse4 Green4 Medium Spring Green Spring Green Lime Green Spring Green#95B9C7 #5E767E #5E7D7E #617C58 #348781 #306754 #4E8975 #254117 #387C44 #4E9258 #347235 #347C2C #667C26 #437C17 #347C17 #348017 #4AA02C #41A317 #4AA02CLight Blue3 Light Blue4 Pale Turquoise4 Dark Sea Green4 Medium Aquamarine Medium Sea Green Sea Green Dark Green Sea Green4 Forest Green Medium Forest Green Spring Green4 Dark Olive Green4 Chartreuse4 Green4 Medium Spring Green Spring Green Lime Green Spring GreenDark Sea Green Dark Sea Green3 Green3 Chartreuse3 Yellow Green Spring Green3 Sea Green3 Spring Green2 Spring Green1 Sea Green2 Sea Green1 Dark Sea Green2 Dark Sea Green1 Green Lawn Green Green1 Green2 Chartreuse2 Chartreuse#8BB381 #99C68E #4CC417 #6CC417 #52D017 #4CC552 #54C571 #57E964 #5EFB6E #64E986 #6AFB92 #B5EAAA #C3FDB8 #00FF00 #87F717 #5FFB17 #59E817 #7FE817 #8AFB17Dark Sea Green Dark Sea Green3 Green3 Chartreuse3 Yellow Green Spring Green3 Sea Green3 Spring Green2 Spring Green1 Sea Green2 Sea Green1 Dark Sea Green2 Dark Sea Green1 Green Lawn Green Green1 Green2 Chartreuse2 ChartreuseGreen Yellow Dark Olive Green1 Dark Olive Green2 Dark Olive Green3 Yellow Yellow1 Khaki1 Khaki2 Goldenrod Gold2 Gold1 Goldenrod1 Goldenrod2 Gold Gold3 Goldenrod3 Dark Goldenrod Khaki Khaki3#B1FB17 #CCFB5D #BCE954 #A0C544 #FFFF00 #FFFC17 #FFF380 #EDE275 #EDDA74 #EAC117 #FDD017 #FBB917 #E9AB17 #D4A017 #C7A317 #C68E17 #AF7817 #ADA96E #C9BE62Green Yellow Dark Olive Green1 Dark Olive Green2 Dark Olive Green3 Yellow Yellow1 Khaki1 Khaki2 Goldenrod Gold2 Gold1 Goldenrod1 Goldenrod2 Gold Gold3 Goldenrod3 Dark Goldenrod Khaki Khaki3Khaki4 Dark Goldenrod1 Dark Goldenrod2 Dark Goldenrod3 Sienna1 Sienna2 Dark Orange Dark Orange1 Dark Orange2 Dark Orange3 Sienna3 Sienna Sienna4 Indian Red4 Dark Orange3 Salmon4 Dark Goldenrod4 Gold4 Goldenrod4#827839 #FBB117 #E8A317 #C58917 #F87431 #E66C2C #F88017 #F87217 #E56717 #C35617 #C35817 #8A4117 #7E3517 #7E2217 #7E3117 #7E3817 #7F5217 #806517 #805817Khaki4 Dark Goldenrod1 Dark Goldenrod2 Dark Goldenrod3 Sienna1 Sienna2 Dark Orange Dark Orange1 Dark Orange2 Dark Orange3 Sienna3 Sienna Sienna4 Indian Red4 Dark Orange3 Salmon4 Dark Goldenrod4 Gold4 Goldenrod4Light Salmon4 Chocolate Coral3 Coral2 Coral Dark Salmon Salmon1 Salmon2 Salmon3 Light Salmon3 Light Salmon2 Light Salmon Sandy Brown Hot Pink Hot Pink1 Hot Pink2 Hot Pink3 Hot Pink4 Light Coral#7F462C #C85A17 #C34A2C #E55B3C #F76541 #E18B6B #F88158 #E67451 #C36241 #C47451 #E78A61 #F9966B #EE9A4D #F660AB #F665AB #E45E9D #C25283 #7D2252 #E77471Light Salmon4 Chocolate Coral3 Coral2 Coral Dark Salmon Pale Turquoise4 Salmon2 Salmon3 Light Salmon3 Light Salmon2 Light Salmon Sandy Brown Hot Pink Hot Pink1 Hot Pink2 Hot Pink3 Hot Pink4 Light CoralIndian Red1 Indian Red2 Indian Red3 Red Red1 Red2 Firebrick1 Firebrick2 Firebrick3 Pink Rosy Brown1 Rosy Brown2 Pink2 Light Pink Light Pink1 Light Pink2 Pink3 Rosy Brown3 Rosy Brown#F75D59 #E55451 #C24641 #FF0000 #F62217 #E41B17 #F62817 #E42217 #C11B17 #FAAFBE #FBBBB9 #E8ADAA #E7A1B0 #FAAFBA #F9A7B0 #E799A3 #C48793 #C5908E #B38481Indian Red1 Indian Red2 Indian Red3 Red Red1 Red2 Firebrick1 Firebrick2 Firebrick3 Pink Rosy Brown1 Rosy Brown2 Pink2 Light Pink Light Pink1 Light Pink2 Pink3 Rosy Brown3 Rosy BrownLight Pink3 Rosy Brown4 Light Pink4 Pink4 Lavender Blush4 Light Goldenrod4 Lemon Chiffon4 Lemon Chiffon3 Light Goldenrod3 Light Golden2 Light Goldenrod Light Goldenrod1 Lemon Chiffon2 Lemon Chiffon Light Goldenrod Yellow#C48189 #7F5A58 #7F4E52 #7F525D #817679 #817339 #827B60 #C9C299 #C8B560 #ECD672 #ECD872 #FFE87C #ECE5B6 #FFF8C6 #FAF8CCLight Pink3 Rosy Brown4 Light Pink4 Pink4 Lavendar Blush4 Light Goldenrod4 Lemon Chiffon4 Lemon Chiffon3 Light Goldenrod3 Light Golden2 Light Goldenrod Light Goldenrod1 Lemon Chiffon2 Lemon Chiffon Light Goldenrod YellowSyntax <TAGNAME bgcolor="value">Quick and dirty, here is how to change the background of your web page. Just use the bgcolor attribute in the <body> tag and you are golden.HTML Code:<body bgcolor="Silver"><p>We set the background...</p> </body>Paragraph Bgcolor:We set the background of this paragraph to be silver. The body tag is where you change the pages background. Now continue the lesson to learn more about adding background colors in your HTML!Adding Color to Your TablesThis example shows how to add a background color for an entire table using generic values of color.HTML Code:<table bgcolor="lime" border="1"><tr> <td>A lime colored table background using color names.</td> </tr></table> <table bgcolor="#ff0000" border="1"><tr> <td>A red colored table background using hexadecimal values "#FF0000".</td> </tr></table> <table bgcolor="rgb(0, 0, 255)" border="1"><tr> <td>A blue colored table background using RGB values "rgb(0, 0, 255)".</td> </tr></table>Table Bgcolors:A lime colored table background using color names. A red colored table background using hexadecimal values "#FF0000". A blue colored table background using RGB values "rgb(0, 0, 255)".Adding Color to Table Rows & ColumnsHere's a few common examples of "bgcolor" and font colorHTML Code:<table> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr> <tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr><tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr> <tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> </table>Alternating Colors:This Row is Yellow! This Row is Gray! This Row is Yellow! This Row is Gray! This Row is Yellow! This Row is Gray!Background Color and Font Color Together!Check out this "Scoreboard" we made with the use of font color and bgcolor!HTML Code:<table bgcolor="#000000"> <tr><td bgcolor="#009900"> <font color="#FFFF00" align="right">Green Bay</font></td> <td><font color="#FFFFFF">13</font></td></tr> <tr><td bgcolor="#0000FF"> <font color="#DDDDDD" align="right">New England</font></td> <td><font color="#FFFFFF">27</font></td></tr> </table>Scoreboard:Green Bay 13New England 27HTML Code:<table bgcolor="#777777"> <tr><td> <p><font face="Monotype Corsiva, Verdana" size="4" color="#00FF00"> This paragraph tag has... </font></p> </td></tr> </table>Colored Paragraph: This paragraph tag has a gray background with green colored font. You should see Monotype Corsiva font if you have it installed, or Verdana as the backup. Both fonts are widely accepted as standard fonts.Symbol How to use 7 8 9 10 Number Circle bullet Reverse bullet Empty bullet Reverse bullet DescriptionPress and hold the ALT key and type the number of desired symbol.html tips: bullet listsThis page shows you how you can do bullet lists, and how to specify different types of bullets for your html documents.bullet listsThe following example shows a bullet list with three items.<ul> <li>First item <li>Second item <li>Third item </ul>This is what it looks like: First item Second item Third itemBullet lists are indented from the main text, and a line is skipped:This is the main text, notice there is no code for a line break <ul> <li>First item <li>Second item <li>Third item </ul>This is the result: This is the main text, notice there is no code for a line breakFirst itemSecond item Third itemembedded bullet listsYou can put bullet lists inside bullet lists. The code for the embedded list is given in red in the next example:<ul> <li>First item <ul> <li>First item of embedded list <li>Second item of embedded list <li>Third item of embedded list </ul> <li>Second item <li>Third item </ul>The result of that code appears below; notice that the bullet changes by default (but, on different systems using "Japanese Auto-Detect, the bullets may be identical). In the next section, I'll show you the code to specify what kind of bullet your browser displays.First item o First item of embedded list o Second item of embedded list o Third item of embedded list Second item Third itemdifferent bullet typesThere are three different types of bullets. The code for each is shown below, in red; examples follow. (Note that in the next example, the squares are filled in on Netscape for Windows, but black outlines with white insides on Netscape for Macintosh).<ul> <li type=square>First item <li type=square>Second item <li type=square>Third item </ul> First item Second item Third itemCircles: <ul> <li type=circle>First item<li type=circle>Second item <li type=circle>Third item </ul>o o oFirst item Second item Third itemYou can mix them: <ul> <li type=disc>First item<li type=circle>Second item <li type=square>Third item </ul> o First item Second item Third itemitem titlesThe easiest way to do item titles is to code a break into it.<ul> <li type=disc>First item title<br> A paragraph or explanation of the first item goes here. Notice there are no paragraph or break codes in the paragraphs <li type=disc>Second item title<br> A paragraph or explanation of the second item goes here. </ul> First item title A paragraph or explanation of the first item goes here. Notice there are no paragraph or break codes in the paragraphs Second item title A paragraph or explanation of the second item goes here.<img src="http://www.quackit.com/pix/milford_sound/milford_sound_t.jpg" width="225" height="151" alt="Milford Sound in New Zealand" /><a href="http://www.hyperlinkcode.com"><img src="http://hyperlinkcode.com/images/sampleimage.gif"></a> <a href="http://www.hyperlinkcode.com"><img src="/images/sample-image.gif" border="0"></a>You might also likePHP Cheat SheetPDFNo ratings yetPHP Cheat Sheet5 pages300315416divyaPDFNo ratings yet300315416divya150 pagesHTMLPDFNo ratings yetHTML82 pagesPestle Analysis-TanzaniaPDFNo ratings yetPestle Analysis-Tanzania3 pagesHTML TagsPDFNo ratings yetHTML Tags8 pages6 ECU Development UNAL 20240129PDF100% (1)6 ECU Development UNAL 20240129346 pagesHTML Tags ChartPDF100% (3)HTML Tags Chart10 pages30 HTML Best Practices For BeginnersPDF100% (1)30 HTML Best Practices For Beginners20 pagesThe Ultimate Guide To Master HTML - CSSPDFNo ratings yetThe Ultimate Guide To Master HTML - CSS87 pagesExample: HTML Tags ChartPDFNo ratings yetExample: HTML Tags Chart8 pagesJavaScript Quick Reference Cheat SheetPDF100% (1)JavaScript Quick Reference Cheat Sheet2 pagesGoa List1PDF100% (1)Goa List110 pagesRamsey Barometer UP24B Manual PDFPDF100% (1)Ramsey Barometer UP24B Manual PDF41 pagesArduino Based Lightning Detector ProjectPDFNo ratings yetArduino Based Lightning Detector Project6 pagesHTML Tags ChartPDFNo ratings yetHTML Tags Chart7 pagesHTML and CssPDFNo ratings yetHTML and Css20 pagesSPPL Ca 2022 V18aPDFNo ratings yetSPPL Ca 2022 V18a284 pagesVSCode Shortcuts CheatSheetPDFNo ratings yetVSCode Shortcuts CheatSheet51 pagesExample: HTML Tags ChartPDFNo ratings yetExample: HTML Tags Chart6 pagesThe Ultimate JavaScript HandbookPDF100% (1)The Ultimate JavaScript Handbook52 pagesLong Vowels PassagesPDFNo ratings yetLong Vowels Passages60 pagesA18 A19 CylinderPDFNo ratings yetA18 A19 Cylinder4 pagesImport Procedure Custom Clearance and ProhibitionsPDFNo ratings yetImport Procedure Custom Clearance and Prohibitions19 pagesCSS (With HTML5) Learn CSS in One Day and Learn It Well. CSS for Beginners With Hands-On Project. Includes HTML5. (Learn Coding Fast With Hands-On Project Book 2) by LCF Publishing Jamie Chan (Z-lib.orPDFNo ratings yetCSS (With HTML5) Learn CSS in One Day and Learn It Well. CSS for Beginners With Hands-On Project. Includes HTML5. (Learn Coding Fast With Hands-On Project Book 2) by LCF Publishing Jamie Chan (Z-lib.or119 pagesProgramming - Programming QuickStart Box Set - HTML, Javascript & CSS (Programming, HTML, Javascript, CSS, Computer Programming) (PDFDrive)PDFNo ratings yetProgramming - Programming QuickStart Box Set - HTML, Javascript & CSS (Programming, HTML, Javascript, CSS, Computer Programming) (PDFDrive)223 pagesHTML Cheat SheetPDFNo ratings yetHTML Cheat Sheet53 pagesJs Cheatsheet by Coding - DevPDFNo ratings yetJs Cheatsheet by Coding - Dev24 pagesJavascript Cheat Sheet: Beginner's EssentialPDFNo ratings yetJavascript Cheat Sheet: Beginner's Essential29 pagesHTML Tags Chart: Tag Name Code Example Browser ViewPDFNo ratings yetHTML Tags Chart: Tag Name Code Example Browser View11 pagesNPN AmplifierPDFNo ratings yetNPN Amplifier7 pagesUltimate Javascript Cheat Sheet - 200+ ResourcesPDFNo ratings yetUltimate Javascript Cheat Sheet - 200+ Resources27 pagesHTML Tags ChartPDFNo ratings yetHTML Tags Chart10 pagesAdvanced Javascript Concepts Cheat Sheet: Zero To MasteryPDF100% (4)Advanced Javascript Concepts Cheat Sheet: Zero To Mastery96 pagesHTML Interview Questions and AnswersPDFNo ratings yetHTML Interview Questions and Answers56 pagesHTML CheatsheetPDFNo ratings yetHTML Cheatsheet16 pagesJS Cheat SheetPDF100% (6)JS Cheat Sheet4 pagesHTML Cheat SheetPDFNo ratings yetHTML Cheat Sheet1 pageThe Ultimate Java CheatSheetPDF100% (4)The Ultimate Java CheatSheet100 pagespipemill-engPDFNo ratings yetpipemill-eng24 pagesHlk Resort MenuPDFNo ratings yetHlk Resort Menu5 pagesUM0470 User Manual: STM8 SWIM Communication Protocol and Debug ModulePDFNo ratings yetUM0470 User Manual: STM8 SWIM Communication Protocol and Debug Module39 pagesHTML Tags Chart: Tag Name Code Example Browser ViewPDFNo ratings yetHTML Tags Chart: Tag Name Code Example Browser View9 pagesLearn Javascript in A DAY!PDF100% (8)Learn Javascript in A DAY!192 pagesJava Programming Cheat SheetPDF50% (4)Java Programming Cheat Sheet13 pagesLearn CSSPDFNo ratings yetLearn CSS235 pagesHTML5 Elements: Web Technology Assignment - 1947234PDF100% (2)HTML5 Elements: Web Technology Assignment - 194723458 pages!doctype HTML Head Title /title /head Body h1 /h1 P /P /body /HTMLPDFNo ratings yet!doctype HTML Head Title /title /head Body h1 /h1 P /P /body /HTML113 pagesHTML and CSS GlossaryPDFNo ratings yetHTML and CSS Glossary3 pagesLCD Monitor 41h4vduPDFNo ratings yetLCD Monitor 41h4vdu9 pagesJavaScript For DummiesPDF100% (1)JavaScript For Dummies45 pagesJavascript Tutorial: Examples in Each ChapterPDFNo ratings yetJavascript Tutorial: Examples in Each Chapter285 pagesHTML TutorialPDFNo ratings yetHTML Tutorial474 pagesAOCSOfficialMethod Ja9-87 GardnerColorPDFNo ratings yetAOCSOfficialMethod Ja9-87 GardnerColor1 pagejurnal Grain_Size_AnalysisPDFNo ratings yetjurnal Grain_Size_Analysis9 pagesHTMLPDF100% (1)HTML121 pagess130 s150 User Manual v1 50 PDFPDFNo ratings yets130 s150 User Manual v1 50 PDF19 pagesJavaScript Good PracticesPDF100% (1)JavaScript Good Practices41 pagesWhat Is HTML5?PDFNo ratings yetWhat Is HTML5?49 pagesWeb Technologies Lecture Notes On Unit 2PDF100% (2)Web Technologies Lecture Notes On Unit 235 pagesHTML CheatsheetPDF60% (5)HTML Cheatsheet1 page(Prothrombin Time) : Intended UsePDFNo ratings yet(Prothrombin Time) : Intended Use2 pagesJs Cheatsheet PDFPDF89% (9)Js Cheatsheet PDF13 pagesJava ScriptPDFNo ratings yetJava Script45 pages4º Eso. Card6. First AidPDFNo ratings yet4º Eso. Card6. First Aid3 pagesANODISATION ImplantPDFNo ratings yetANODISATION Implant3 pagesExperimental Analysis of Pressure VesselPDFNo ratings yetExperimental Analysis of Pressure Vessel8 pagesHTML Codes Foa WebsitePDF100% (1)HTML Codes Foa Website180 pagesJavascript Fundamentals: Varma BhupatirajuPDFNo ratings yetJavascript Fundamentals: Varma Bhupatiraju74 pagesHTML Cheat SheetPDFNo ratings yetHTML Cheat Sheet53 pagesHTML Cheatsheet: Tags AttributesPDF100% (5)HTML Cheatsheet: Tags Attributes4 pagesJava ScriptPDFNo ratings yetJava Script82 pagesService Manual S130 Skid-Steer LoaderPDF100% (1)Service Manual S130 Skid-Steer Loader15 pagesHTML Cheat Sheet: Beginner'sPDFNo ratings yetHTML Cheat Sheet: Beginner's23 pagesWhat Is The Difference Between A Cogeneration Power Plant and A Combined Cycle Power PlantPDF100% (1)What Is The Difference Between A Cogeneration Power Plant and A Combined Cycle Power Plant1 pageJquery 1.5 Visual Cheat SheetPDF100% (3)Jquery 1.5 Visual Cheat Sheet4 pagesLearn CSS - Selectors and Visual Rules Cheatsheet - CodecademyPDFNo ratings yetLearn CSS - Selectors and Visual Rules Cheatsheet - Codecademy6 pages50 JavaScript TipsPDF83% (6)50 JavaScript Tips15 pagesJavascript Cheat Sheet v1PDFNo ratings yetJavascript Cheat Sheet v11 pageAC Belt - 95141M67K01 Maruti Suzuki Genuine PartsPDFNo ratings yetAC Belt - 95141M67K01 Maruti Suzuki Genuine Parts1 pageJavaScript FundamentalsPDF100% (6)JavaScript Fundamentals80 pagesBobby Marino - HW 02 Part 1PDFNo ratings yetBobby Marino - HW 02 Part 11 pagePrefacePDFNo ratings yetPreface3 pagesAdhoc List NRC Pom PDFPDFNo ratings yetAdhoc List NRC Pom PDF3 pagesRequirementsPDFNo ratings yetRequirements4 pagesTags, Their Use and HTML Version Availability: List of Event Attributes Supported in Both HTML 5 and HTML 4PDFNo ratings yetTags, Their Use and HTML Version Availability: List of Event Attributes Supported in Both HTML 5 and HTML 41 pageEffective PresentationPDFNo ratings yetEffective Presentation3 pagesEffective PresentationPDFNo ratings yetEffective Presentation3 pagesPit SlavesPDFNo ratings yetPit Slaves8 pagesCSS Interview Questions and Answers SetPDF100% (1)CSS Interview Questions and Answers Set10 pagesEvaporation PDFNo ratings yetEvaporation 7 pagesOral Care in India: Euromonitor International April 2021PDFNo ratings yetOral Care in India: Euromonitor International April 202111 pagesHTML Cheat Sheet: A List of Common HTML Codes and Their PurposePDFNo ratings yetHTML Cheat Sheet: A List of Common HTML Codes and Their Purpose4 pagesStructure of AttitudesPDFNo ratings yetStructure of Attitudes5 pagesIntroduction to HTML & CSSFrom EverandIntroduction to HTML & CSSClaudia Da Silva4.5/5 (4)Javascript - 50 functions and tutorialFrom EverandJavascript - 50 functions and tutorialNino PaiottaNo ratings yetDocumentsComputersInternet & Web
HTML Tags Chart
AI-enhanced description
To use any of the following HTML tags, simply select the HTML code you'd like and copy and paste it into your web page. Tag <!-<a <b> <big> <body> Name comment anchor bold Code Example Browser View
<!--This can be viewed in the HTML part of a Nothing will show (Tip) document--> <a href="http://www.domain.com/"> Visit Our Site</a> <b>Example</b> Visit Our Site (Tip) Example
big (text) <big>Example</big> body of <body>The content of your HTML HTML documen page</body> t line break
Example (Tip)Contents of your web page (Tip)
<br>
The contents of your web The contents of your page<br>The contents of page your page The contents of your web page <center>This will center your contents</center> This will center your contents Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term Definition Term Definition of the term This is an Example of
<center> center
<dd>
<dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> descripti <dt>Definition Term</dt> on <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> <dt>Definition Term</dt> list <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> definition <dd>Definition of the term</dd> term <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> emphasis This is an <em>Example</em> of using
<dl>
<dt>
<em>
the emphasis tag <embed> embed object <embed src="yourfile.mid" width="100%" height="60" align="center">
<embed>
embed object
Music will begin playing when your page is loaded and will only play one time. A control panel will be displayed to enable your visitors to stop the music. Example (Tip)
<font face="Times New Roman">Example</font> <font face="Times New Roman" size="4">Example</font> <font face="Times New Roman" size="+3" color="#ff0000">Example</font> <form action="mailto:you@yourdomain.com"> Name: <input name="Name" value="" size="10"><br> Email: <input name="Email" value="" size="10"><br> <center><input type="submit"></center> </form> <h1>Heading 1 Example</h1> <h2>Heading 2 Example</h2> <h3>Heading 3 Example</h3> <h4>Heading 4 Example</h4> <h5>Heading 5 Example</h5> <h6>Heading 6 Example</h6>
Example (Tip)
Example (Tip)Name: Email: (Tip)
<form>
form
<head>
heading of HTML <head>Contains elements describing the documen document</head> t horizonta <hr /> l rule
<hr>
Contents of your web page horizonta <hr width="50%" size="3" /> l rule Contents of your web page Contents of your web page Contents of your web page Contents of your web page
Contents of your web <hr> page horizonta (Internet <hr width="75%" color="#ff0000" size="4" /> l rule Explorer) Contents of your web page <hr> horizonta (Internet <hr width="25%" color="#6699ff" size="6" /> l rule Explorer) Contents of your web page <html> <head> <meta> hypertext <title>Title of your web page</title> markup </head> language <body>HTML web page contents </body> </html> italic image <i>Example</i> <img src="Earth.gif" width="41" height="41" border="0" alt="text describing the image" /> Example 1: <form method=post action="/cgibin/example.cgi"> <input type="text" size="10" maxlength="30"> <input type="Submit" value="Submit"> </form> Example 2: Example 1: (Tip) Contents of your web page
<html>
<i> <img>
<input>
input field
input
Example 2: (Tip)
<form method=post action="/cgibin/example.cgi"> <input type="text" style="color: #ffffff; fontfamily: Verdana; font-weight: bold; font-size: 12px; background-color: #72a4d2;" size="10" maxlength="30"> <input type="Submit" value="Submit"> </form> Example 3: <form method=post action="/cgibin/example.cgi"> <table border="0" cellspacing="0" cellpadding="2"><tr><td bgcolor="#8463ff"><input type="text" size="10" maxlength="30"></td><td bgcolor="#8463ff" valign="Middle"> <input type="image" name="submit" src="yourimage.gif"></td></tr> </table> </form> Example 4: <form method=post action="/cgibin/example.cgi"> Enter Your Comments:<br> <textarea wrap="virtual" name="Comments" rows=3 cols=20 maxlength=100></textarea><br> <input type="Submit" value="Submit"> <input type="Reset" value="Clear"> </form> Example 5: <form method=post action="/cgibin/example.cgi"> <center> Select an option: <select> <option >option 1</option> <option selected>option 2</option> <option>option 3</option> <option>option 4</option> <option>option 5</option> <option>option 6</option> Example 4: (Tip) Example 3: (Tip)
</select><br> <input type="Submit" value="Submit"></center> </form> Example 6: <form method=post action="/cgiExample 6: (Tip) bin/example.cgi"> Select an option:<br> <input type="radio" name="option"> Option 1 Select an option: <input type="radio" name="option" checked> Option 1 Option 2 Option 2 <input type="radio" name="option"> Option 3 <br> Option 3 <br> Select an option:<br> Select an option: <input type="checkbox" name="selection"> Selection 1 Selection 1 <input type="checkbox" name="selection" Selection 2 checked> Selection 2 Selection 3 <input type="checkbox" name="selection"> Selection 3 <input type="Submit" value="Submit"> </form> Example 1: Example 1: (Tip) <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </MENU> <li> list item Example 2: <ol type="i"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> <link> link <head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> o
Example 2: i. ii. iii. iv. List item 1 List item 2 List item 3 List item 4
<marque <marquee bgcolor="#cccccc" loop="-1" e> scrolling scrollamount="2" width="100%">Example (Internet text Marquee</marquee> Explorer) <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </menu> o
<menu>
menu
<meta>
meta
<meta name="Description" content="Description of your site"> Nothing will show (Tip) <meta name="keywords" content="keywords describing your site"> <meta HTTP-EQUIV="Refresh" CONTENT="4;URL=http://www.yourdomain. Nothing will show (Tip) com/"> <meta http-equiv="Pragma" content="nocache"> <meta name="rating" content="General"> <meta name="robots" content="all"> <meta name="robots" content="noindex,follow"> Numbered <ol> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Numbered 1. 2. 3. 4. List item 1 List item 2 List item 3 List item 4
Numbered Special Start 5. 6. 7. 8. List item 1 List item 2 List item 3 List item 4
<ol>
ordered list
Numbered Special Start <ol start="5"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Lowercase Letters
d. List item 4 <ol type="a"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Letters <ol type="A"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Letters Special Start <ol type="A" start="3"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Lowercase Roman Numerals <ol type="i"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Roman Numerals <ol type="I"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> Capital Roman Numerals Special Start VII. VIII. IX. X. List item 1 List item 2 List item 3 List item 4 Capital Letters Special Start C. D. E. F. List item 1 List item 2 List item 3 List item 4 Capital Letters A. B. C. D. List item 1 List item 2 List item 3 List item 4
Lowercase Roman Numerals i. ii. iii. iv. List item 1 List item 2 List item 3 List item 4
Capital Roman Numerals I. II. III. IV. List item 1 List item 2 List item 3 List item 4
<ol type="I" start="7"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li> <li>List item 4</li> </ol> <form method=post action="/cgibin/example.cgi"> <center> Select an option: <select> <option>option 1</option> <option selected>option 2</option> <option>option 3</option> <option>option 4</option> <option>option 5</option> <option>option 6</option> </select><br> </center> </form> This is an example displaying the use of the paragraph tag. <p> This will create a line break and a space between lines. Attributes: Example 1:<br> <br> <p align="left"> This is an example<br> displaying the use<br> of the paragraph tag.<br> paragrap <br> h Example 2:<br> <br> <p align="right"> This is an example<br> displaying the use<br> of the paragraph tag.<br> <br> Example 3:<br> <br> <p align="center"> This is an example<br> displaying the use<br>
<option>
listbox option
This is an example displaying the use of the paragraph tag. This will create a line break and a space between lines. Attributes: Example 1: This is an example displaying the use of the paragraph tag. Example 2: This is an example displaying the use of the paragraph tag. Example 3: This is an example
<p>
of the paragraph tag. <small> <strike> <strong> small (text) deleted text <small>Example</small> <strike>Example</strike>
(Tip)
Example Example
strong <strong>Example</strong> emphasis Example 1: <table border="4" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Example 2: (Internet Explorer) <table border="2" bordercolor="#336699" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Example 3: <table cellpadding="2" cellspacing="2" width="100%"> <tr> <td bgcolor="#cccccc">Column 1</td> <td bgcolor="#cccccc">Column 2</td> </tr> <tr> <td>Row 2</td> <td>Row 2</td> </tr> </table>
<table>
table
<td>
table data
<tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> <div align="center"> <table> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr> <td>Row 2</td> <td>Row 2</td> <td>Row 2</td> </tr> <tr> <td>Row 3</td> <td>Row 3</td> <td>Row 3</td> </tr> <tr> <td>Row 4</td> <td>Row 4</td> <td>Row 4</td> </tr> </table> </div>
Column 1
Column 2
<th>
table header
<title>
documen <title>Title of your HTML page</title> t title <table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> table row <td>Column 1</td> <td>Column 2</td> </tr> </table> teletype <tt>Example</tt> underline <u>Example</u> Example 1:<br> unordere <br> d list <ul>
Title of your web page will be viewable in the title bar. (Tip)
<tr>
Example
Example Example 1:
List item 1
<li>List item 1</li> <li>List item 2</li> </ul> <br> Example 2:<br> <ul type="disc"> <li>List item 1</li> <li>List item 2</li> <ul type="circle"> <li>List item 3</li> <li>List item 4</li> </ul> </ul>
List item 2
Example 2:
Use our HTML color picker if you need to choose from an almost infinite variety of colors. Also, if you like a color scheme of a web page view Tip142 for a fantastic tool that can be used to gather that page's color codes.COLOR NAME Black Gray0 Gray18 Gray21 Gray23 Gray24 Gray25 Gray26 Gray27 Gray28 Gray29 Gray30 Gray31 Gray32 Gray34 Gray35 CODE #000000 #150517 #250517 #2B1B17 #302217 #302226 #342826 #34282C #382D2C #3b3131 #3E3535 #413839 #41383C #463E3F #4A4344 #4C4646 COLOR Black Gray0 Gray18 Gray21 Gray23 Gray24 Gray25 Gray26 Gray27 Gray28 Gray29 Gray30 Gray31 Gray32 Gray34 Gray35
Gray36 Gray37 Gray38 Gray39 Gray40 Gray41 Gray42 Gray43 Gray44 Gray45 Gray46 Gray47 Gray48 Gray49 Gray50 Gray Slate Gray4 Slate Gray Light Steel Blue4
#4E4848 #504A4B #544E4F #565051 #595454 #5C5858 #5F5A59 #625D5D #646060 #666362 #696565 #6D6968 #6E6A6B #726E6D #747170 #736F6E #616D7E #657383 #646D7E
Light Slate Gray Cadet Blue4 Dark Slate Gray4 Thistle4 Medium Slate Blue Medium Purple4 Midnight Blue Dark Slate Blue Dark Slate Gray Dim Gray Cornflower Blue Royal Blue4 Slate Blue4 Royal Blue Royal Blue1 Royal Blue2 Royal Blue3 Deep Sky Blue Deep Sky Blue2
#6D7B8D #4C787E #4C7D7E #806D7E #5E5A80 #4E387E #151B54 #2B3856 #25383C #463E41 #151B8D #15317E #342D7E #2B60DE #306EFF #2B65EC #2554C7 #3BB9FF #38ACEC
Slate Blue Deep Sky Blue3 Deep Sky Blue4 Dodger Blue Dodger Blue2 Dodger Blue3 Dodger Blue4 Steel Blue4 Steel Blue Slate Blue2 Violet Medium Purple3 Medium Purple Medium Purple2 Medium Purple1 Light Steel Blue Steel Blue3 Steel Blue2 Steel Blue1
#357EC7 #3090C7 #25587E #1589FF #157DEC #1569C7 #153E7E #2B547E #4863A0 #6960EC #8D38C9 #7A5DC7 #8467D7 #9172EC #9E7BFF #728FCE #488AC7 #56A5EC #5CB3FF
Sky Blue3 Sky Blue4 Slate Blue Slate Blue Slate Gray3 Violet Red Violet Red1 Violet Red2 Deep Pink Deep Pink2 Deep Pink3 Deep Pink4 Medium Violet Red Violet Red3 Firebrick Violet Red4 Maroon4 Maroon Maroon3
#659EC7 #41627E #737CA1 #737CA1 #98AFC7 #F6358A #F6358A #E4317F #F52887 #E4287C #C12267 #7D053F #CA226B #C12869 #800517 #7D0541 #7D0552 #810541 #C12283
Maroon2 Maroon1 Magenta Magenta1 Magenta2 Magenta3 Medium Orchid Medium Orchid1 Medium Orchid2 Medium Orchid3 Medium Orchid4 Purple Purple1 Purple2 Purple3 Purple4 Dark Orchid4 Dark Orchid Dark Violet
#E3319D #F535AA #FF00FF #F433FF #E238EC #C031C7 #B048B5 #D462FF #C45AEC #A74AC7 #6A287E #8E35EF #893BFF #7F38EC #6C2DC7 #461B7E #571B7e #7D1B7E #842DCE
Dark Orchid3 Dark Orchid2 Dark Orchid1 Plum4 Pale Violet Red Pale Violet Red1 Pale Violet Red2 Pale Violet Red3 Pale Violet Red4 Plum Plum1 Plum2 Plum3 Thistle Thistle3 Lavender Blush2 Lavender Blush3 Thistle2 Thistle1
#8B31C7 #A23BEC #B041FF #7E587E #D16587 #F778A1 #E56E94 #C25A7C #7E354D #B93B8F #F9B7FF #E6A9EC #C38EC7 #D2B9D3 #C6AEC7 #EBDDE2 #C8BBBE #E9CFEC #FCDFFF
Lavender Lavender Blush Light Steel Blue1 Light Blue Light Blue1 Light Cyan Slate Gray1 Slate Gray2 Light Steel Blue2 Turquoise1 Cyan Cyan1 Cyan2 Turquoise2 Medium Turquoise Turquoise Dark Slate Gray1 Dark Slate Gray2 Dark Slate Gray3
#E3E4FA #FDEEF4 #C6DEFF #ADDFFF #BDEDFF #E0FFFF #C2DFFF #B4CFEC #B7CEEC #52F3FF #00FFFF #57FEFF #50EBEC #4EE2EC #48CCCD #43C6DB #9AFEFF #8EEBEC #78c7c7
Lavender Lavender Blush Light Steel Blue1 Light Blue Light Blue1 Light Cyan Slate Gray1 Slate Gray2 Light Steel Blue2 Turquoise1 Cyan Cyan1 Cyan2 Turquoise2 Medium Turquoise Turquoise Dark Slate Gray1 Dark slate Gray2 Dark Slate Gray3
Cyan3 Turquoise3 Cadet Blue3 Pale Turquoise3 Light Blue2 Dark Turquoise Cyan4 Light Sea Green Light Sky Blue Light Sky Blue2 Light Sky Blue3 Sky Blue Sky Blue2 Light Sky Blue4 Sky Blue Light Slate Blue Light Cyan2 Light Cyan3 Light Cyan4
#46C7C7 #43BFC7 #77BFC7 #92C7C7 #AFDCEC #3B9C9C #307D7E #3EA99F #82CAFA #A0CFEC #87AFC7 #82CAFF #79BAEC #566D7E #6698FF #736AFF #CFECEC #AFC7C7 #717D7D
Light Blue3 Light Blue4 Pale Turquoise4 Dark Sea Green4 Medium Aquamarine Medium Sea Green Sea Green Dark Green Sea Green4 Forest Green Medium Forest Green Spring Green4 Dark Olive Green4 Chartreuse4 Green4 Medium Spring Green Spring Green Lime Green Spring Green
#95B9C7 #5E767E #5E7D7E #617C58 #348781 #306754 #4E8975 #254117 #387C44 #4E9258 #347235 #347C2C #667C26 #437C17 #347C17 #348017 #4AA02C #41A317 #4AA02C
Dark Sea Green Dark Sea Green3 Green3 Chartreuse3 Yellow Green Spring Green3 Sea Green3 Spring Green2 Spring Green1 Sea Green2 Sea Green1 Dark Sea Green2 Dark Sea Green1 Green Lawn Green Green1 Green2 Chartreuse2 Chartreuse
#8BB381 #99C68E #4CC417 #6CC417 #52D017 #4CC552 #54C571 #57E964 #5EFB6E #64E986 #6AFB92 #B5EAAA #C3FDB8 #00FF00 #87F717 #5FFB17 #59E817 #7FE817 #8AFB17
Green Yellow Dark Olive Green1 Dark Olive Green2 Dark Olive Green3 Yellow Yellow1 Khaki1 Khaki2 Goldenrod Gold2 Gold1 Goldenrod1 Goldenrod2 Gold Gold3 Goldenrod3 Dark Goldenrod Khaki Khaki3
#B1FB17 #CCFB5D #BCE954 #A0C544 #FFFF00 #FFFC17 #FFF380 #EDE275 #EDDA74 #EAC117 #FDD017 #FBB917 #E9AB17 #D4A017 #C7A317 #C68E17 #AF7817 #ADA96E #C9BE62
Khaki4 Dark Goldenrod1 Dark Goldenrod2 Dark Goldenrod3 Sienna1 Sienna2 Dark Orange Dark Orange1 Dark Orange2 Dark Orange3 Sienna3 Sienna Sienna4 Indian Red4 Dark Orange3 Salmon4 Dark Goldenrod4 Gold4 Goldenrod4
#827839 #FBB117 #E8A317 #C58917 #F87431 #E66C2C #F88017 #F87217 #E56717 #C35617 #C35817 #8A4117 #7E3517 #7E2217 #7E3117 #7E3817 #7F5217 #806517 #805817
Light Salmon4 Chocolate Coral3 Coral2 Coral Dark Salmon Salmon1 Salmon2 Salmon3 Light Salmon3 Light Salmon2 Light Salmon Sandy Brown Hot Pink Hot Pink1 Hot Pink2 Hot Pink3 Hot Pink4 Light Coral
#7F462C #C85A17 #C34A2C #E55B3C #F76541 #E18B6B #F88158 #E67451 #C36241 #C47451 #E78A61 #F9966B #EE9A4D #F660AB #F665AB #E45E9D #C25283 #7D2252 #E77471
Light Salmon4 Chocolate Coral3 Coral2 Coral Dark Salmon Pale Turquoise4 Salmon2 Salmon3 Light Salmon3 Light Salmon2 Light Salmon Sandy Brown Hot Pink Hot Pink1 Hot Pink2 Hot Pink3 Hot Pink4 Light Coral
Indian Red1 Indian Red2 Indian Red3 Red Red1 Red2 Firebrick1 Firebrick2 Firebrick3 Pink Rosy Brown1 Rosy Brown2 Pink2 Light Pink Light Pink1 Light Pink2 Pink3 Rosy Brown3 Rosy Brown
#F75D59 #E55451 #C24641 #FF0000 #F62217 #E41B17 #F62817 #E42217 #C11B17 #FAAFBE #FBBBB9 #E8ADAA #E7A1B0 #FAAFBA #F9A7B0 #E799A3 #C48793 #C5908E #B38481
Light Pink3 Rosy Brown4 Light Pink4 Pink4 Lavender Blush4 Light Goldenrod4 Lemon Chiffon4 Lemon Chiffon3 Light Goldenrod3 Light Golden2 Light Goldenrod Light Goldenrod1 Lemon Chiffon2 Lemon Chiffon Light Goldenrod Yellow
#C48189 #7F5A58 #7F4E52 #7F525D #817679 #817339 #827B60 #C9C299 #C8B560 #ECD672 #ECD872 #FFE87C #ECE5B6 #FFF8C6 #FAF8CC
Light Pink3 Rosy Brown4 Light Pink4 Pink4 Lavendar Blush4 Light Goldenrod4 Lemon Chiffon4 Lemon Chiffon3 Light Goldenrod3 Light Golden2 Light Goldenrod Light Goldenrod1 Lemon Chiffon2 Lemon Chiffon Light Goldenrod Yellow
Quick and dirty, here is how to change the background of your web page. Just use the bgcolor attribute in the <body> tag and you are golden.
HTML Code:<body bgcolor="Silver">
Paragraph Bgcolor:We set the background of this paragraph to be silver. The body tag is where you change the pages background. Now continue the lesson to learn more about adding background colors in your HTML!
HTML Code:<table bgcolor="lime" border="1"><tr> <td>A lime colored table background using color names.</td> </tr></table> <table bgcolor="#ff0000" border="1"><tr> <td>A red colored table background using hexadecimal values "#FF0000".</td> </tr></table> <table bgcolor="rgb(0, 0, 255)" border="1"><tr> <td>A blue colored table background using RGB values "rgb(0, 0, 255)".</td> </tr></table>
Table Bgcolors:A lime colored table background using color names. A red colored table background using hexadecimal values "#FF0000". A blue colored table background using RGB values "rgb(0, 0, 255)".
HTML Code:<table> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr> <tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>
<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> <tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr> <tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr> </table>
Alternating Colors:This Row is Yellow! This Row is Gray! This Row is Yellow! This Row is Gray! This Row is Yellow! This Row is Gray!
HTML Code:<table bgcolor="#000000"> <tr><td bgcolor="#009900"> <font color="#FFFF00" align="right">Green Bay</font></td> <td><font color="#FFFFFF">13</font></td></tr> <tr><td bgcolor="#0000FF"> <font color="#DDDDDD" align="right">New England</font></td> <td><font color="#FFFFFF">27</font></td></tr> </table>
Scoreboard:Green Bay 13
New England 27
HTML Code:<table bgcolor="#777777"> <tr><td> <p><font face="Monotype Corsiva, Verdana" size="4" color="#00FF00"> This paragraph tag has... </font></p> </td></tr> </table>
Colored Paragraph: This paragraph tag has a gray background with green colored font. You should see Monotype Corsiva font if you have it installed, or Verdana as the backup. Both fonts are widely accepted as standard fonts.Symbol How to use 7 8 9 10 Number Circle bullet Reverse bullet Empty bullet Reverse bullet Description
Press and hold the ALT key and type the number of desired symbol.
bullet listsThe following example shows a bullet list with three items.<ul> <li>First item <li>Second item <li>Third item </ul>
Bullet lists are indented from the main text, and a line is skipped:This is the main text, notice there is no code for a line break <ul> <li>First item <li>Second item <li>Third item </ul>
This is the result: This is the main text, notice there is no code for a line break
First item
The result of that code appears below; notice that the bullet changes by default (but, on different systems using "Japanese Auto-Detect, the bullets may be identical). In the next section, I'll show you the code to specify what kind of bullet your browser displays.
First item o First item of embedded list o Second item of embedded list o Third item of embedded list Second item Third item
o o o
item titlesThe easiest way to do item titles is to code a break into it.<ul> <li type=disc>First item title<br> A paragraph or explanation of the first item goes here. Notice there are no paragraph or break codes in the paragraphs <li type=disc>Second item title<br> A paragraph or explanation of the second item goes here. </ul>
First item title A paragraph or explanation of the first item goes here. Notice there are no paragraph or break codes in the paragraphs Second item title A paragraph or explanation of the second item goes here.