Вы находитесь на странице: 1из 13

HTML Tags Chart 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> Name Code Example Browser View Nothing will show (Tip)

comme <!--This can be viewed in nt the HTML part of a document-->

<a Visit Our anchor href="http://www.domain.com/"> Site (Tip) Visit Our Site</a> bold big (text) <b>Example</b> <big>Example</big> Example Example (Tip) Contents of your web page (Tip)

body of HTML <body>The content of <body> docume your HTML page</body> nt <br> line break

The contents of The contents of your page<br>The your web page contents of 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

<center center >

<dd>

<dl> <dt>Definition Term</dt> definiti <dd>Definition of the on term</dd> descrip <dt>Definition Term</dt> tion <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> definiti <dd>Definition of the term</dd> on list <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> definiti <dl> on term <dt>Definition Term</dt>

<dl>

<dt>

<dd>Definition of the term</dd> <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> <em>

of the term Definition Term Definition of the term

This is This is emphas an Example of an <em>Example</em> of using is using the emphasis tag the emphasis tag (Tip)

<embed src="yourfile.mid" <embed embed width="100%" height="60" > object align="center">

<embed src="yourfile.mid" autostart="true" hidden="false" <embed embed loop="false"> > object <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) Example (Tip)

<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 >

<font> font

Example (Tip)

<form> form

<form action="mailto:you@yourd omain.com"> Name: <input name="Name" Name: value="" size="10"><br> Tip) Email: <input name="Email" Email: value="" size="10"><br> Submit <center><input type="submit"></center> </form>

<h1> <h2> <h3> <h4> <h5> <h6>

headin g1 headin g2 headin g3 headin g4 headin g5 headin g6

<h1>Heading <h2>Heading <h3>Heading <h4>Heading <h5>Heading <h6>Heading

1 2 3 4 5 6

Example</h1> Example</h2> Example</h3> Example</h4> Example</h5> Example</h6>

headin g of <head>Contains elements <head> HTML Nothing will show describing the document</head> docume nt horizon <hr /> tal rule Contents of your web page (Tip) Contents of your web page Contents of your web page Contents of your web page Contents of your web page Contents of your web page

<hr>

<hr>

horizon <hr width="50%" size="3" /> tal rule

<hr>

horizon <hr width="50%" size="3" tal rule noshade />

<hr> Contents of your (Interne horizon <hr width="75%" color="#ff0000" web page t tal rule size="4" /> Contents of your Explorer web page ) <hr> Contents of your (Interne horizon <hr width="25%" color="#6699ff" web page t tal rule size="6" /> Contents of your Explorer web page )

<html> <head> hyperte <meta> xt <title>Title of your web Contents of your <html> markup page</title> web page langua </head> ge <body>HTML web page contents </body> </html> <i> <img> 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="/cgiExample 1: (Tip) bin/example.cgi"> <input type="text" size="10" Submit maxlength="30"> <input type="Submit" value="Submit"> </form> Example 2: <form method=post action="/cgibin/example.cgi"> <input type="text" style="color: Example 2: (Tip) #ffffff; font-family: Verdana; fontweight: bold; font-size: 12px; Submit 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 Example 3: (Tip)

Example (Tip)

<input>

input field

<input> (Interne input t field Explorer )

<input> input field

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"> Example 4: (Tip) Enter Your Comments:<br> <textarea wrap="virtual" name="Comments" rows=3 cols=20 maxlength=100></textarea><br> <input type="Submit" Submit Clear value="Submit"> <input type="Reset" value="Clear"> </form> Example 5: <form method=post action="/cgibin/example.cgi"> <center> Select an option: <select> Example 5: Tip) <option >option 1</option> <option selected>option Select an 2</option> option: <option>option 3</option> <option>option 4</option> Submit <option>option 5</option> <option>option 6</option> </select><br> <input type="Submit" value="Submit"></center> </form> Example 6: Example 6: (Tip)

<input>

input field

<input>

input field

<input> input field

<form method=post action="/cgibin/example.cgi"> Select an option:<br> <input type="radio" name="option"> Option 1 Select an option: <input type="radio" Option 1 name="option" checked> Option 2 <input type="radio" Option 2 name="option"> Option 3 Option 3 <br> <br> Select an option: Select an option:<br> <input type="checkbox" Selection 1 name="selection"> Selection 1 Selection 2 <input type="checkbox" Selection 3 name="selection" checked> Selection 2 Submit <input type="checkbox" name="selection"> Selection 3 <input type="Submit" value="Submit"> </form> Example 1: <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </MENU> 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> Example 1: (Tip)
o

List item 1 List item 2 List item 3

<li>

list item

Example 2: i. ii. iii. iv. List item 1 List item 2 List item 3 List item 4

<marqu ee> <marquee bgcolor="#cccccc" (Interne scrollin loop="-1" scrollamount="2" t g text width="100%">Example Explorer Marquee</marquee> ) <menu menu > <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

<meta> meta

<meta name="Description" content="Description of your site"> Nothing will <meta name="keywords" show (Tip) content="keywords describing your site"> <meta HTTP-EQUIV="Refresh" Nothing will CONTENT="4;URL=http://www.yo show (Tip) urdomain.com/"> <meta http-equiv="Pragma" content="no-cache"> <meta name="rating" content="General"> <meta name="robots" content="all"> <meta name="robots" content="noindex,follow"> Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Nothing will show (Tip) Numbered 1</li> 2</li> 3</li> 4</li> 1. 2. 3. 4. List List List List item item item item 1 2 3 4

<meta> meta <meta> meta <meta> meta <meta> meta <meta> meta <ol>

ordered Numbered list <ol> <li>List item <li>List item <li>List item <li>List item </ol>

Numbered Special Start 5. List item 1 6. List item 2

Numbered Special Start <ol start="5">

<li>List <li>List <li>List <li>List </ol>

item item item item

1</li> 2</li> 3</li> 4</li>

7. List item 3 8. List item 4 Lowercase Letters a. b. c. d. List List List List item item item item 1 2 3 4

Lowercase 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 <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

Capital Letters A. B. C. D. List List List List item item item item 1 2 3 4

Capital Letters Special Start C. D. E. F. List List List List item item item item 1 2 3 4

Lowercase Roman Numerals i. ii. iii. iv. List List List List item item item item 1 2 3 4

Capital Roman Numerals I. II. III. IV. List List List List item item item item 1 2 3 4

Capital Roman

<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 <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 <option listbox 2</option> > option <option>option 3</option> <option>option 4</option> <option>option 5</option> <option>option 6</option> </select><br> </center> </form> <p>

Numerals Special Start VII. VIII. IX. X. List item 1 List item 2 List item 3 List item 4

Select an option: (Tip)

paragra This is an example displaying the ph use of the paragraph tag. <p> This will create a line break and a space between lines. Attributes: <p align="left"> Example 1:<br /> <br /> This is an example<br>

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 displaying the use of the paragraph tag. <small> small (text) <small>Example</small> Example (Tip) Example Example Example 1: (Tip) Column Column 1 2

displaying the use<br> of the paragraph tag.</p> <p align="right"> Example 2:<br> <br> This is an example<br> displaying the use<br> of the paragraph tag.</p> <p align="center"> Example 3:<br> <br> This is an example<br> displaying the use<br> of the paragraph tag.</p>

<strike deleted <strike>Example</strike> > text strong <strong emphas <strong>Example</strong> > is Example 1: <table> table <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 3: (Tip) Column Column 1 2 Row 2 Row 2

Example 2: (Tip) Column Column 1 2

<td>

table data

<table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> Colum Colum <td>Column 2</td> n1 n2 </tr> </table> Colu Colu Colu mn 1 mn 2 mn 3 Row Row Row

<th>

table <div align="center"> header <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> <title> docume <title>Title of your HTML nt title page</title>

2 Row 3 Row 4

2 Row 3 Row 4

2 Row 3 Row 4

Title of your web page will be viewable in the title bar. (Tip)

<tr>

table row

<table border="2" cellpadding="2" Colum Colum cellspacing="2" width="100%"> n1 n2 <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> Example Example Example 1:

<tt> <u> <ul>

teletyp <tt>Example</tt> e underli <u>Example</u> ne unorde Example 1:<br> red list <br> <ul> <li>List item 1</li> <li>List item 2</li> </ul>

List item 1 List item 2

<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>

Example 2:

List item 1 List item 2 o List item 3


o

List item 4

Вам также может понравиться