HTML Tags and Elements Explained

Tag <!
-<a <b> <big> <body>
Name comment anchor bold big (text) body of HTML document line break
CodeExample 
Browser View Nothingwill show (Tip)
<a href="http://www.domain.com/"> VisitOurSite (Tip) Visit Our Site</a> <b>Example</b> <big>Example</big> <body>The content of your HTML page</body> The contents of your page<br>The contents of your page <center>This will center your contents</center> Example
Example (Tip)
Contents of your web page (Tip) The contents of your web page The contents of your web page 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
<br>
<center center >
<dd>
<dl> <dt>Definition Term</dt> <dd>Definition of the definitiondescript term</dd> ion <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> <dd>Definition of the term</dd> <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl> <dl> <dt>Definition Term</dt> <dd>Definition of the term</dd> <dt>Definition Term</dt> <dd>Definition of the term</dd> </dl>
<dl>
definitionlist
<dt>
definitionterm
<em>
emphasis
This is This is an Example of an <em>Example</em> of using using the emphasis tag the emphasis tag <embed src="yourfile.mid" width="100%" height="60" align="center"> <embed src="yourfile.mid" autostart="true" hidden="false" loop="false"> <noembed><bgsound src="yourfile.mid" loop="1"></noembed> <font face="Times New (Tip)
<embed embedobject >
<embed embedobject >
<font>
font
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)
Roman">Example</font> <font> font <font face="Times New Roman" size="4">Example</font> <font face="Times New Roman" size="+3" color="#ff0000">Example</font >
Example (Tip)
<font>
font
Example
(Tip)
<form> form
<form action="mailto:you@yourd omain.com"> Name: <input name="Name" Name: value="" size="10"><br> Email: <input name="Email" Email: value="" size="10"><br> <center><input Enviar type="submit"></center> </form>
Principio del formulario
(Tip)
Final del formulario
<h1> <h2> <h3> <h4> <h5> <h6>
heading heading heading heading heading heading
1 2 3 4 5 6
<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>
<head>
heading of HTML document
<head>Contains elements Nothingwill show describing the document</head> Contents of your web page (Tip) Contents of your web page Contents of your web page
<hr>
horizontal rule
<hr />
<hr>
horizontal rule
<hr width="50%" size="3" /> Contents of your web page <hr width="50%" size="3" noshade /> Contents of your web page Contents of your web page Contents of your web page Contents of your web page
<hr>
horizontal rule
<hr> (Interne t horizontal rule Explorer ) <hr> horizontal rule (Interne
<hr width="75%" color="#ff0000" size="4" />
<hr width="25%" color="#6699ff" Contents of your web size="6" /> page
t Explorer )
Contents of your web page
<html> <head> <meta> <title>Title of your web hypertextmarkupl Contents of your web <html> page</title> anguage page </head> <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="/cgibin/example.cgi"> <input type="text" size="10" maxlength="30"> <input type="Submit" value="Submit"> </form> Example 2: <form method=post action="/cgiPrincipio del formulario bin/example.cgi"> Example 2: (Tip) <input type="text" style="color: #ffffff; font-family: Verdana; fontSubmit weight: bold; font-size: 12px; background-color: #72a4d2;" size="10" maxlength="30"> Final del formulario <input type="Submit" value="Submit"> </form> Example 3: <form method=post action="/cgibin/example.cgi"> Principio del formulario <table border="0" cellspacing="0" cellpadding="2"><tr><td Example 3: (Tip) bgcolor="#8463ff"><input type="text" size="10" maxlength="30"></td><td bgcolor="#8463ff" Final del formulario valign="Middle"><input type="image" name="submit" src="yourimage.gif"></td></tr>< /table> </form> Example 4: <form method=post action="/cgiPrincipio del formulario
Example
(Tip)
Example 1: (Tip)
Submit
<input> input field
<input> (Interne t input field Explorer )
<input> input field
<input> input field
Example 4: (Tip)
bin/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> </select><br> <input type="Submit" value="Submit"></center> </form> Example 6:
Submit
Clear
Example 5: Tip) Selectanoption:

option 2
<input> input field
Submit
Example 6: (Tip)
<input> input field
<form method=post action="/cgi- Select an option: bin/example.cgi"> Select an option:<br> Option 1 <input type="radio" name="option"> Option 1 <input type="radio" Option 2 name="option" checked> Option 2 <input type="radio" name="option"> Option 3 Option 3 <br> <br> Select an option: Select an option:<br> <input type="checkbox" Selection 1 name="selection"> Selection 1 <input type="checkbox" name="selection" Selection 2 checked> Selection 2 <input type="checkbox" name="selection"> Selection 3 Selection 3 <input type="Submit" Submit value="Submit"> </form>
<li>
listitem
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> 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> <marquee bgcolor="#cccccc" loop="-1" scrollamount="2" width="100%">Example Marquee</marquee> <menu> <li type="disc">List item 1</li> <li type="circle">List item 2</li> <li type="square">List item 3</li> </menu>
Listitem 1 Listitem 2 Listitem 3
Example 2: i. Listitem 1 ii. Listitem 2 iii. Listitem 3 iv. Listitem 4
<marqu ee> (Interne scrollingtext t Explorer ) <menu >
(Tip)
Listitem 1 Listitem 2 Listitem 3
menu
<meta> meta
<meta name="Description" content="Description of your site"> Nothingwill show (Tip) <meta name="keywords" content="keywords describing your site"> <meta HTTP-EQUIV="Refresh" CONTENT="4;URL=http://www.yo Nothingwill 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"> Numbered <ol> <li>List <li>List <li>List <li>List </ol> item item item item 1</li> 2</li> 3</li> 4</li> Nothingwill show (Tip) Nothingwill show (Tip) Nothingwill show (Tip) Nothingwill show (Tip) Numbered 1. 2. 3. 4. Listitem 1 Listitem 2 Listitem 3 Listitem 4
<meta> meta <meta> meta <meta> meta <meta> meta <meta> meta <ol> orderedlist
NumberedSpecialStart
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 <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 <ol type="I" start="7"> <li>List item 1</li> <li>List item 2</li> <li>List item 3</li>
5. 6. 7. 8. a. b. c. d.
Listitem 1 Listitem 2 Listitem 3 Listitem 4 Listitem 1 Listitem 2 Listitem 3 Listitem 4
LowercaseLetters
Capital Letters A. Listitem 1 B. Listitem 2 C. Listitem 3 D. Listitem 4 Capital LettersSpecialStart C. Listitem 1 D. Listitem 2 E. F. Listitem 3 Listitem 4
LowercaseRomanNum erals i. ii. Listitem 1 Listitem 2
iii. Listitem 3 iv. Listitem 4 Capital RomanNumerals I. Listitem 1 II. Listitem 2 III. Listitem 3 IV. Listitem 4 Capital RomanNumeralsSpeci alStart VII. Listitem 1 VIII.Listitem 2 IX. Listitem 3 X. Listitem 4
<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>
<option listboxoption >
Selectanoption: (Tip)
option 2
This is an example displaying the use of the paragraph tag. <p> This This is an example will create a line break and a space displaying the use of the paragraph tag. between lines. Attributes: Example 1:<br> <br> <p align="left"> This is an example<br> displaying the use<br> of the paragraph tag.<br> <br> 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> of the paragraph tag. <small>Example</small> <strike>Example</strike> <strong>Example</strong> Example 1: <table> table <table border="4" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> 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.
Example
<p>
paragraph
<small> small (text) <strike > deletedtext
(Tip)
Example Example Example 1: (Tip) Column 1 Column 2 Example 2: (Tip) Column 1 Column 2
<strong strongemphasis >
<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 1 Row 2 Column 2 Row 2
<td>
table data
<table border="2" cellpadding="2" cellspacing="2" width="100%"> <tr> <td>Column 1</td> Column 1 <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>
Column 2
<th>
tableheader
Colu Colum mn Column 3 n1 2

Row 2 Row 3 Row 4 Row Row 2 2 Row Row 3 3 Row Row 4 4
<td>Row 4</td> </tr> </table> </div> <title> documenttitle <title>Title of your HTML page</title> Title of your web page will be viewable in the title bar.(Tip) Column 2
<tr>
tablerow
<table border="2" cellpadding="2" Column 1 cellspacing="2" width="100%"> <tr> <td>Column 1</td> <td>Column 2</td> </tr> </table> <tt>Example</tt> <u>Example</u> Example 1:<br> <br> <ul> <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>
<tt> <u>
teletype underline
Example
Example Example 1: Listitem 1 Listitem 2
Example 2: Listitem 1 Listitem 2 Listitem 3 Listitem 4
<ul>
unorderedlist

HTML Tags and Elements Explained

Transféré par

Informations du document

Description originale:

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

HTML Tags and Elements Explained

Transféré par

Droits d'auteur :

Formats disponibles

Tag <!

-<a <b> <big> <body>

CodeExample

Browser View Nothingwill show (Tip)

<center center >

<embed embedobject >

<embed embedobject >

Principio del formulario

Final del formulario

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

heading heading heading heading heading heading

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

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

heading of HTML document

<hr> (Interne t horizontal rule Explorer ) <hr> horizontal rule (Interne

<hr width="75%" color="#ff0000" size="4" />

<hr width="25%" color="#6699ff" Contents of your web size="6" /> page

Contents of your web page

<input> input field

Final del formulario

<input> (Interne t input field Explorer )

<input> input field

<input> input field

Final del formulario

Principio del formulario

Example 5: Tip) Selectanoption:

<input> input field

Final del formulario

Principio del formulario

<input> input field

Listitem 1 Listitem 2 Listitem 3

Example 2: i. Listitem 1 ii. Listitem 2 iii. Listitem 3 iv. Listitem 4

<marqu ee> (Interne scrollingtext t Explorer ) <menu >

Listitem 1 Listitem 2 Listitem 3

Listitem 1 Listitem 2 Listitem 3 Listitem 4 Listitem 1 Listitem 2 Listitem 3 Listitem 4

LowercaseRomanNum erals i. ii. Listitem 1 Listitem 2

Principio del formulario

<option listboxoption >

<small> small (text) <strike > deletedtext

<strong strongemphasis >

Example 3: (Tip) Column 1 Row 2 Column 2 Row 2

Colu Colum mn Column 3 n1 2

Example 2: Listitem 1 Listitem 2 Listitem 3 Listitem 4

Vous aimerez peut-être aussi