Tags
|
Description
• Meaning • Definition
|
<a>
|
|
<abbr>
|
ABBREVIATION tags indicate
interpretation of the meaning to the browsers and search engines for such as
kind of abbreviations as "Inc.", "etc.".
|
<acronym>
|
ACRONYM tags defines an acronym,
like; <acronym title="World Wide Web">WWW</acronym>.
|
<address>
|
ADDRESS tags are used to identify
the author's contact information for a section or a document.
|
<applet>
|
APPLET element tags are used to
embed and invoke a Java application within an HTML page.
|
<area>
|
AREA tag defines a section of an
image.
|
<b>
|
BOLD tag is specifying <b>bold
section</b> within the text document.
|
<base>
|
BASE tag defines information
regarding to the links on the page.
|
<basefont>
|
BASEFONT tags defines changes of
all text appearance on the web page.
|
<bdo>
|
BDO tag is specifying the
direction of text display by overwriting the default value from Left to
Right. <bdo dir="rtl">Right to Left</bdo>
|
<bgsound>
|
BGSOUND tag is defining a
background sound for a webpage.
<html> <head> <bgsound src="JingleBells.wav" loop="3"> </head> <body> </body> </html> Demo • Example |
<big>
|
BIG tag makes the <big>text larger</big>
then the rest of the text.
|
<blockquote>
|
BLOCKQUOTE tags
<blockquote>separate a
section</blockquote>
of text from the surrounding text.
|
<blink>
|
BLINK tags defines text to <blink>blink</blink>
repeatedly. Internet Explorer doesn't support this tag yet.
|
<body>
|
<html>
<head> </head> <body> Body tags identify the content of a web page. </body> </html> |
<br>
|
Line Break tag is
specifying<br>
a new line |
<button>
|
BUTTON tag is used to create a
<button type="button">Push Button</button>
|
<caption>
|
<table>
<caption>CAPTION tag adds a caption to a table.</caption> <tr> <td> </td> </tr> </table> |
<center>
|
<center>CENTER
tags center text, images, etc.</center>
|
<cite>
|
<cite>CITE tags
defines a citation and displaying in italics.</cite>
|
<code>
|
CODE tags are used for example, to
indicate a code of the current <code>htmltags.html</code> page.
|
<col>
|
COL tags are used to define column
properties for table columns.
<table> <colgroup span="2"> <col width="60" align="left"></col> <col width="80" align="center"></col> </colgroup> <tr> <td>1st Column</td> <td>2nd Column</td> </tr> </table> |
<colgroup>
|
COLGROUP tags are used to define
groups of table columns.
<table> <colgroup span="2"> <col width="60" align="left"></col> <col width="80" align="center"></col> </colgroup> <tr> <td>1st Column</td> <td>2nd Column</td> </tr> </table> |
<dd>
|
DD tag defines a definition
description.
<dl> <dt>NASA</dt> <dd>National Aeronautics and Space Administration</dd> <dt>MBA</dt> <dd>Master of Business Administration</dd> </dl> |
<dfn>
|
DFN tags emphasize definition, for
example; <dfn>PC</dfn>: Personal Computer.
|
<del>
|
DEL tag indicates <del>
|
<dir>
|
DIR tags define directory lists.
<dir> <li>First</li> <li>Second</li> <li>Third</li> </dir> |
<dl>
|
DL tag defines a definition list.
<dl> <dt>CSU</dt> <dd>California State University</dd> <dt>UN</dt> <dd>United Nations</dd> </dl> |
<div>
|
DIV tag is a logical section of a
web document.
<div> <h1>Home Pets</h1> <p>Cats</p> <p>Dogs</p> </div> |
<dt>
|
DT tags defines a definition term.
<dl> <dt>HTML</dt> <dd>HyperText Markup Language</dd> <dt>CSS</dt> <dd>Cascading Style Sheets</dd> </dl> |
Tags
|
Description
• Meaning • Definition
|
<embed>
|
EMBED tag gives a command to a
browser to include a multimedia elements, such as video, sound files within a
web document.
<embed src="videofile.mov" width="100" height="100"> <embed src="musicfile.mid" width="50" height="50"> Demo • Example |
<em>
|
EM tags <em>emphasize</em>
text.
|
<fieldset>
|
FIELDSET tag creates a form for
all elements in it.
<fieldset>Find a rounded-corner box around this text.</fieldset> |
<font>
|
FONT tags attribute text <font
face="cursive, serif">font</font>, <font
color="#0000ff">color</font>,
and <font size="4">size</font>.
|
<form>
|
Form tags define a form.
<form action="contact.html" method="post"> Your Email: <input type="text" name="visitor-email" maxlength="80" value="" /><br /> Your Name: <input type="text" name="visitor-name" maxlength="80" value="" /><br /> <input type="submit" value="Send" /> </form>
eMail:
Name: |
<frame>
|
Frame tags define each frame
within a frameset.
<html> <head> <title>Frame Tags in Action</title> </head> <noframes> <body> <h1>Sorry, your browser doesn't support this feature!</h1> </body> </noframes> <frameset cols="35%, 65%"> <frame src ="/htmlcodes/left-frame.html" /> <frame src ="/htmlcodes/right-frame.html" /> </frameset> </html> Demo • Example |
<frameset>
|
FRAMESET tags define a layout of
frames.
<html> <frameset cols="45%, *"> <frame src ="/htmlcodes/left-frame.html" /> <frame src ="/htmlcodes/right-frame.html" /> </frameset> </html> Demo • Example |
<h1> - <h6>
|
H1 - H6 define level 1-6 headers.
<h1>Header 1</h1>
<h2>Header
2</h2>
<h3>Header
3</h3>
<h4>Header
4</h4>
<h5>Header
5</h5>
<h6>Header
6</h6>
|
<head>
|
Head tags define general
information about the document, page title, meta-tags, scripts and links to
follow, and other commands to browsers.
<html> <head> <title>HTML Tags - Head Tag</title> <meta name="keywords" content="html tags, head tag" /> <link rel="stylesheet" type="text/css" href="style.css" /> <script src="javaexample.js" type="text/javascript"></script> </head> <body> </body> </html> |
<hr>
|
HR tag draws a horizontal break line.
Two choices for the same result: <hr> or <hr /> |
<html>
|
HTML tags contain HTML elements,
and give a command to browsers to read the document as an HTML document.
<html> <head> </head> <body> </body> </html> |
<iframe>
|
iFrame tag creates an inline frame
that contains another web page in it.
|
<img>
|
IMG tag attributes an image.
<img src="http://www.fillster.com/images/tutorial.gif" width="60" height="62" alt="Here write a name for your image" />  |
<input>
|
INPUT tags define input fields,
check boxes, radio buttons.
<form action="contact.html" method="post"> Your Email: <input type="text" name="visitor-email" maxlength="80" value="" /><br /> Your Name: <input type="text" name="visitor-name" maxlength="80" value="" /><br /> <input type="radio" name="Level" value="Web Designer" />Web Designer<br /> <input type="radio" name="Level" value="Web Developer" checked="checked" />Web Developer<br /> <input type="checkbox" name="Computer" value="Windows" />Windows<br /> <input type="checkbox" name="Computer" value="Mac" />Mac<br /> <input type="submit" value="Send" /> </form>
eMail:
Name: Web Designer Web Developer Windows Mac |
<ins>
|
INS tag defines an <ins>inserted text</ins>.
|
<isindex>
|
ISINDEX tag defines a single-line input field.
<isindex prompt="Example: ">
Example:
|
<i>
|
<I> tag is specifying <i>italic
text</i>.
|
<kbd>
|
KBD tag stands for <kbd>keyboard text</kbd>.
|
<label>
|
LABEL tag defines a label to a
form control.
<p>Where do you live?</p> <form action=""> <input type="radio" name="country" id="us" /> <label for="usa">USA</label><br /> <input type="radio" name="country" id="uk" /> <label for="uk">UK</label> </form>
Where do you live?
USA
UK |
<legend>
|
LEGEND tag assigns a caption in a
fieldset element.
<legend>Questionnaire</legend> <p>Where do you live?</p> <form action=""> <input type="radio" name="country" id="usa" /> <label for="usa">USA</label><br /> <input type="radio" name="country" id="canada" /> <label for="canada">Canada</label> </form> Questionnaire
Where do you live?
USA
Canada |
<li>
|
LI tag defines a list of ordered
and unordered items.
<ol> <li>HTML</li> <li>PHP</li> <li>JavaScript</li> </ol> <ul> <li>HTML</li> <li>PHP</li> <li>JavaScript</li> </ul>
|
<link>
|
LINK tag defines a link to an
external document, such as External Style Sheets.
<head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> |
<marquee>
|
MARQUEE tags define different
movement behaviors.
Demos • Examples |
<menu>
|
MENU tag defines a menu list.
<menu> <li>Google</li> <li>Yahoo</li> <li>MSN</li> </menu>
· Google
· Yahoo
· MSN
|
<meta>
|
META tags are declaring
information for the search engine robots and crawlers.
<html> <head> <meta name="description" content="Page description goes here."> <meta name="keywords" content="meta tags, html tags, meta"> </head> <body> </body> </html> |
<noframe>
|
NOFRAME tag is specifying an
alternate web page layout for browsers that don't support frames.
<html> <head> <title>Frame Tags in Action</title> </head> <noframes> <body> <h1>Sorry, your browser doesn't support this feature!</h1> </body> </noframes> <frameset cols="35%, 65%"> <frame src ="/htmlcodes/left-frame.html" /> <frame src ="/htmlcodes/right-frame.html" /> </frameset> </html> Demo • Example |
<noscript>
|
NOSCRIPT tag is specifying a
"NOSCRIPT" version page layout for browsers that don't support
"SCRIPT" version. NOSCRIP tags are used in conjunction with the
JavaScript or VBScript elements.
<script type="text/javascript" language="javascript"> document.write("We are here to learn HTML"); </script> <noscript> Sorry, your browser doesn't support JavaScript, VBScript. </noscript> |
Tags
|
Description
• Meaning • Definition
|
<optgroup>
|
OPTGROUP tag creates an option drop-down group menu.
<select> <optgroup label="Fruits"> <option value ="banana">Banana</option> <option value ="pineapple">Pineapple</option> </optgroup> <optgroup label="Vegetables"> <option value ="tomato">Tomato</option> <option value ="potato">Potato</option> </optgroup> </select> |
<option>
|
OPTION tag creates a drop-down menu. OPTION tag works only
in conjunction with a SELECT tag.
<select> <option value ="beginner" selected="selected">Beginner</option> <option value ="intermediate">Intermediate</option> <option value ="advanced">Advanced</option> </select> |
<ol>
|
OL tags define an ordered list of
items.
<ol> <li>Red</li> <li>Green</li> <li>Blue</li> </ol>
|
<p>
|
<P> tag is specifying a paragraph and creates a new
line.
<h4>Header
4</h4>
<p>This is a paragraph.</p> |
<pre>
|
PRE tag is specifing a
preformatted text. This tag does,t let the browsers to eliminate "white
spaces" in the text.
<pre>
City London Cool
City Paris Awesome
City New
York Great
</pre>
EXAMPLE
City London Cool
City Paris Awesome
City New
York Great
|
<q>
|
<Q> tag is specifing short
quotations. The function is similar to <blockquote> tag except that
<Q> tag doesn't break lines of the text.
<q>I'll be back</q> - is a popular phrase associated with Arnold Schwarzenegger. |
<s>
|
<S> tag produces a strike
throughout a text. <S> tag is depreciated and is not supported in XHTML
1.0 Strict DTD, therefore it's recommended to use DEL tag instead.
Strike through <s> |
<samp>
|
SAMP tag is specifing a
fixed-width font.
Compare for yourself - 1 <samp>Compare for yourself - 2<samp> |
<script>
|
SCRIPT tags define scripts within
a web page and let the web browsers know that it's not an HTML section. You
can place a <SCRIPT> tag anywhere within HTML, but the best practice is
to place it between the <HEAD></HEAD> tags.
<html> <head> <script src="javascript.js" type="text/javascript"></script> </head> <body> <script type="text/javascript"> document.write("This is a script tag placement tutorial.") </script> </body> </html> |
<select>
|
SELECT tag creates a menu on a form.
<select> <option value ="planes" selected="selected">Planes</option> <option value ="trains">Trains</option> <option value ="automobiles">Automobiles</option> </select> |
<small>
|
SMALL tag creates a small text.
Compare normal text in relationship to <small>small text</small> |
<span>
|
SPAN tag is specifying a section
of a document.
<div> <p>Cats and Dogs <span style="color:blue;">are our friends.</span></p> </div> |
<strike>
|
STRIKE tag creates a strike
through words or text. Strike tag is depreciated and is not supported in
XHTML 1.0 Strict DTD, therefore it's recommended to use DEL tag instead.
<strike> |
<strong>
|
STRONG tag is specifying a strong
text.
<div> <p>Weightlifters are <strong>strong people.</strong></p> </div> |
<style>
|
STYLE tag specifies a link and
location to a style sheet, and gives a command to browsers regarding to a
layout for a web page. Please find; First bold line is an External Style, and
the next bold lines are for the Internal Style web page presentation.
<html> <head> <title>HTML Tags - Head Tag</title> <link rel="stylesheet" type="text/css" href="style.css" /> <style type="text/css"> h1{text-align: center; font-style: italic} p{color:#ff0000} </style> </head> <body> </body> </html> |
<sub>
|
SUB tag is defining a subscripted
text.
SUB tag is creating <sub>a subscripted text.</sub> |
<sup>
|
SUP tag is defining a
superscripted text.
SUP tag is creating <sup>a superscripted text.</sup> |
<table>
|
TABLE tag is defining a table.
<table> <tr> <td>First Cell</td> <td>Second Cell</td> </tr> </table> |
<td>
|
TD tag creates a data cell.
<table> <tr> <td>First Data Cell</td> <td>Second Data Cell</td> </tr> </table> |
<th>
|
TH tag creates a header cell.
<table> <tr> <th colspan="2">My Shopping List</th> </tr> <tr> <td>Apples</td> <td>Pears</td> </tr> </table> |
<tr>
|
TR tag creates a row in a table.
<table> <tr> <td>Data Cell 1</td> <td>Data Cell 2</td> </tr> </table> |
<tbody>
|
TBODY tag creates a table body.
<table> <thead> <tr> <td colspan="2">>Header - Complete List of Basic HTML Tags</td> </tr> </thead> <tbody> <tr> <td>Tags</td> <td>Attributes</td> </tr> </tbody> <tfoot> <tr> <td colspan="2">>Footer - Created by Fillster.com</td> </tr> </tfoot> </table> |
<textarea>
|
TEXTAREA tag creates a text area.
<textarea rows="4" cols="30"> Place you text in here... </textarea> |
<tfoot>
|
TFOOT tag creates a table footer.
<table> <thead> <tr> <td colspan="2">>Header - HTML Tags List</td> </tr> </thead> <tbody> <tr> <td>HTML Tags</td> <td>HTML Attributes</td> </tr> </tbody> <tfoot> <tr> <td colspan="2">>Footer - Copyright © Fillster.com</td> </tr> </tfoot> </table> |
<thead>
|
THEAD tag creates a table header.
<table> <thead> <tr> <td colspan="2">>Header text place here.</td> </tr> </thead> <tbody> <tr> <td>Element - 1</td> <td>Element - 2</td> </tr> </tbody> <tfoot> <tr> <td colspan="2">>Footer notes put here.</td> </tr> </tfoot> </table> |
<title>
|
TITLE tag declares a title of an
HTML document.
<html> <head> <title>Brief description of the web page.</title> </head> <body> </body> </html> |
<tt>
|
TT tag creates a teletype text.
This is a default font of the text, <tt>but this is a teletype font.</tt> |
<u>
|
U tag makes an underlined text.
This text has the <u>underlined words.</u> |
<ul>
|
UL tags define an unordered list
of items.
<ul> <li>Code</li> <li>Script</li> <li>Tag</li> </ul>
|
<var>
|
VAR tag indicates a variable
parameter.
This is a <var>variable parameter<var> of the sentence. |
<!DOCTYPE html>
<html>
<body>
<ul type="square">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<ul type="circle">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<p>The type attribute is not supported in HTML5. Use
CSS instead.</p>
</body>
</html>
0 comments:
Post a Comment