The var html tag
Overview
The <var> HTML tag is known as a phrase tag, it is mainly used to style text. It is also mainly used when displaying computer programming code to highlight variables used in the code, although there are actually no restrictions where you can use this HTML tag. It works equally as well in table based layouts as well as CSS based ones. As with all phrase based HTML tags it can be used in situations where consistency between browsers is difficult to achieve in other ways. When text is put between the opening and closing <var> tag it is displayed as a variable text.
Basic Usage
<var>Some variable text in here</var>
Any text between the opening and closing tag will be displayed as a variable text.
Advance Usage
It is possible to style and add functionality to the <var> tag, this is done by adding an attribute to after the p in the opening <var> tag
Attributes allowed for the <var>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<var id=”header”>Some variable text</var>
With all attributes there is a space after the initial p then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <var> tag may use either the id or class as an attribute.
The attribute style allows you to include css style information for a single <var> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in JavaScript and therefore outside the scope of this document
Examples
<var>Some variable text</var> – basic usage example.
<var id=”header”>Some variable text</var> – variable text which is styled by the id header.
<var class=”header”> Some variable text </var> – variable text which is styled by the class header.
<var id =”header” class=”header”> Some variable text </var> – variable text which is styled by the class header and the id header.
<var style=”color:#F00;”>Some variable text</var> – variable text which has a custom colour of red.
<var dir=”rtl”>Some variable text</var> – variable text where the text reads from right to left.
<var lang=”uk”>Some variable text</var> – variable text where the language has been tagged as UK.
<var title=”title”>Some variable text</var> – variable text where the tag has been titled title.
Final Thoughts
Touching on just the surface of the <var> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The h6 html tag
In HTML h tags stand for heading and this is split into 6 different h tags (h1, h2, h3, h4, h5 and h6). By default it is displayed as bold and much smaller version of the body text. As with all h tags it is considered important for SEO.When text is put between the opening and closing <h6> tag it is displayed as a Small heading. Unlike <h1> a <h6> tag can be used multiple times on a webpage as its job is to be the heading for a web pages sub topics. The <h6> tag is not used often due to 5 other h tags being available.
Basic Usage
<h6>Smallest header text</h6>
Any text between the opening and closing tag will be displayed as a very small heading.
Advance Usage
It is possible to style and add functionality to the <h6> tag, this is done by adding an attribute to after the h6 in the opening <h6> tag
Attributes allowed for the <h6>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<h6 id=”header”>Smallest header text</h6>
With all attributes there is a space after the initial h6 then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <h6> tag the class attribute is nearly always used over the id attribute although in practice it makes no difference.
The attribute style allows you to include css style information for a single <h6> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document
Examples
<h6>Smallest header text</h6> – basic usage example.
<h6 id=”header”>Smallest header text</h6> – heading 6 which is styled by the id header.
<h6 class=”headerclass”> Smallest header text </h6> – heading 6 which is styled by the class headerclass.
<h6 id =”header” class=”headerclass”> Smallest header text </h6> – heading 6 which is styled by the class headerclass and the id header.
<h6 style=”color:#F00″>Smallest header text</h6> – heading 6 which has a custom colour of red.
<h6 dir=”rtl”>Smallest header text</h6> – heading 6 where the text reads from right to left.
<h6 lang=”uk”>Smallest header text</h6> – heading 6 where the language has been tagged as UK.
<h6 title=”ptitle”>Smallest header text</h6> – heading 6 where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <h6> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The center html tag
Overview
By default body text in a HTML document is aligned left, by using the <center> HTML tag you can make the text appeared centred within its surrounding tag. It is a widely used tags in HTML today. It works equally as well in table based layouts as well as CSS based ones. It was often used in the past to centre the content of <div> tags, but this is now usually dealt with purely in CSS. As with all older HTML tags it can be used in situations where consistency between browsers is difficult to achieve in other ways. When text is put between the opening and closing <center> tag it is displayed as a center text.
Basic Usage
<center>Some center text in here</center>
Any text between the opening and closing tag will be displayed as a center text.
Advance Usage
It is possible to style and add functionality to the <center> tag, this is done by adding an attribute to after the p in the opening <center> tag
Attributes allowed for the <center>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<center id=”header”>Some center text</center>
With all attributes there is a space after the initial p then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <center> tag may use either the id or class as an attribute.
The attribute style allows you to include CSS style information for a single <center> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in JavaScript and therefore outside the scope of this document
Examples
<center>Some center text</center> – basic usage example.
<center id=”header”>Some center text</center> – center text which is styled by the id header.
<center class=”header”> Some center text </center> – center text which is styled by the class header.
<center id =”header” class=”header”> Some center text </center> – center text which is styled by the class header and the id header.
<center style=”color:#F00;”>Some center text</center> – center text which has a custom colour of red.
<center dir=”rtl”>Some center text</center> – center text where the text reads from right to left.
<center lang=”uk”>Some center text</center> – center text where the language has been tagged as UK.
<center title=”title”>Some center text</center> – center text where the tag has been titled title.
Final Thoughts
Touching on just the surface of the <center> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The div html tag
Overview
In simple terms the <div> HTML tag stands for division. It is one of the most widely used tags in HTML today. With the use of CSS it allows virtually any design to be created. Prior to the <div> tag, layout was created using the <table> tag. Division based layouts are considered to be better than table based layouts due to a number of factors including accessibility and SEO. As mentioned CSS allows this tag to create virtually any layout, but due to differences between how internet browsers support CSS, a consistent result can be harder to achieve. When.When text is put between the opening and closing <div> tag it is displayed as a Division.
Basic Usage
<div>Some div text in here</div>
Any text between the opening and closing tag will be displayed as a Division.
Advance Usage
It is possible to style and add functionality to the <div> tag, this is done by adding an attribute to after the p in the opening <div> tag
Attributes allowed for the <div>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<div id=”header”>Some div text</div>
With all attributes there is a space after the initial p then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <div> tag may use either the id or class as an attribute.
The attribute style allows you to include CSS style information for a single <div> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in JavaScript and therefore outside the scope of this document
Examples
<div>Some div text</div> – basic usage example.
<div id=”header”>Some div text</div> – Division which is styled by the id header.
<div class=”header”> Some div text </div> – Division which is styled by the class header.
<div id =”header” class=”header”> Some div text </div> – Division which is styled by the class header and the id header.
<div style=”color:#F00;”>Some div text</div> – Division which has a custom colour of red.
<div dir=”rtl”>Some div text</div> – Division where the text reads from right to left.
<div lang=”uk”>Some div text</div> – Division where the language has been tagged as UK.
<div title=”title”>Some div text</div> – Division where the tag has been titled title.
Final Thoughts
Touching on just the surface of the <div> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The h5 html tag
Overview
In HTML h tags stand for heading and this is split into 6 different h tags (h1, h2, h3, h4, h5 and h6). The <h5> tag itself is considered to be a smaller repeating sub header for a webpage. By default it is displayed as bold and smaller version of the body text. As with all h tags it is considered important for SEO.When text is put between the opening and closing <h5> tag it is displayed as a Small heading. Unlike <h1> a <h5> tag can be used multiple times on a webpage as its job is to be the heading for a web pages sub topics.
Basic Usage
<h5>Small header text</h5>
Any text between the opening and closing tag will be displayed as a small heading.
Advance Usage
It is possible to style and add functionality to the <h5> tag, this is done by adding an attribute to after the h5 in the opening <h5> tag
Attributes allowed for the <h5>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<h5 id=”header”>Small header text</h5>
With all attributes there is a space after the initial h5 then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <h5> tag the class attribute is nearly always used over the id attribute although in practice it makes no difference.
The attribute style allows you to include css style information for a single <h5> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document
Examples
<h5>Small header text</h5> – basic usage example.
<h5 id=”header”>Small header text</h5> – heading 5 which is styled by the id header.
<h5 class=”headerclass”> Small header text </h5> – heading 5 which is styled by the class headerclass.
<h5 id =”header” class=”headerclass”> Small header text </h5> – heading 5 which is styled by the class headerclass and the id header.
<h5 style=”color:#F00″>Small header text</h5> – heading 5 which has a custom colour of red.
<h5 dir=”rtl”>Small header text</h5> – heading 5 where the text reads from right to left.
<h5 lang=”uk”>Small header text</h5> – heading 5 where the language has been tagged as UK.
<h5 title=”ptitle”>Small header text</h5> – heading 5 where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <h5> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The pre html tag
Overview
HTML tags are good at the job they do, but often there are limitations. In normal copy there is often a double space after a full stop, if you try this in HTML you will see the extra space is ignored when displayed to screen. the <pre> HTML tag is displays text using a fixed spaced font, which also has the advantage of retaining spaces and line breaks. In short using the <pre> tag will allow you to keep double spaces in your copy. When text is put between the opening and closing <pre> tag it is displayed as a Preformatted text. By default the font will be Courier, but this can be changed.
Basic Usage
<pre>Some Preformatted text in here</pre>
Any text between the opening and closing tag will be displayed as a Preformatted text.
Advance Usage
It is possible to style and add functionality to the <pre> tag, this is done by adding an attribute to after the pre in the opening <pre> tag
Attributes allowed for the <pre>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<pre id=”header”>Some Preformatted text</pre>
With all attributes there is a space after the initial p then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <pre> tag the class attribute is nearly always used over the id attribute.
The attribute style allows you to include css style information for a single <pre> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document.
Examples
<pre>Some Preformatted text</pre> – basic usage example.
<pre id=”header”>Some Preformatted text</pre> – Preformatted text which is styled by the id header.
<pre class=”headerclass”> Some Preformatted text </pre> – Preformatted text which is styled by the class headerclass.
<pre id =”header” class=”headerclass”> Some Preformatted text </pre> – Preformatted text which is styled by the class headerclass and the id header.
<pre style=”color:#F00″>Some Preformatted text</pre> – Preformatted text which has a custom colour of red.
<pre dir=”rtl”>Some Preformatted text</pre> – Preformatted text where the text reads from right to left.
<pre lang=”uk”>Some Preformatted text</pre> – Preformatted text where the language has been tagged as UK.
<pre title=”ptitle”>Some Preformatted text</pre> – Preformatted text where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <pre> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The tt html tag
Overview
In HTML the <tt> tag is a little unusual and is not often used due to its quirky appearance, in short the font mimics that of a Teletype machine. The <tt> tag is one of the original ways to format text and more recently CSS and other tags have reduced the importance of this tag. It is still a good tag when used correctly. When text is put between the opening and closing <tt> tag it is displayed as tt text. The <tt> tag can be used multiple times on a webpage and can be nested inside other tags for dramatic effect.
Basic Usage
<tt>Some tt text</tt>
Any text between the opening and closing tag will be displayed as a large heading.
Advance Usage
It is possible to style and add functionality to the <tt> tag, this is done by adding an attribute to after the tt in the opening <tt> tag.
Attributes allowed for the <tt>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<tt id=”header”>Some tt text</tt>
With all attributes there is a space after the initial b then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <tt> tag the class attribute is nearly always used over the id attribute although in practice it makes no difference.
The attribute style allows you to include css style information for a single <tt> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document
Examples
<tt>Some tt text</tt> – basic usage example.
<tt id=”header”>Some tt text</tt> – tt text which is styled by the id header.
<tt class=”headerclass”> Some tt text </tt> – tt text which is styled by the class headerclass.
<tt id =”header” class=”headerclass”> Some tt text </tt> – tt text which is styled by the class headerclass and the id header.
<tt style=”color:#F00″>Some tt text</tt> – tt text which has a custom colour of red.
<tt dir=”rtl”>Some tt text</tt> – tt text where the text reads from right to left.
<tt lang=”uk”>Some tt text</tt> – tt text where the language has been tagged as UK.
<tt title=”ptitle”>Some tt text</tt> – tt text where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <tt> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The small html tag
Overview
Having the body copy in a web page all displayed as the same size is often normal, but there are times where by making certain parts of the copy slightly smaller, visually breaks up the text and makes it easier to read. In HTML the <small> tag can be used for this. The <small> tag is one of the original ways to format text and more recently CSS and other tags have reduced the importance of this tag. It is still a good tag when used correctly. When text is put between the opening and closing <small> tag it is displayed as small text. The <small> tag can be used multiple times on a webpage and can be nested inside other tags for dramatic effect.
Basic Usage
<small>Some small text</small>
Any text between the opening and closing tag will be displayed as a large heading.
Advance Usage
It is possible to style and add functionality to the <small> tag, this is done by adding an attribute to after the small in the opening <small> tag.
Attributes allowed for the <small>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<small id=”header”>Some small text</small>
With all attributes there is a space after the initial b then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <small> tag the class attribute is nearly always used over the id attribute although in practice it makes no difference.
The attribute style allows you to include css style information for a single <small> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document
Examples
<small>Some small text</small> – basic usage example.
<small id=”header”>Some small text</small> – small text which is styled by the id header.
<small class=”headerclass”> Some small text </small> – small text which is styled by the class headerclass.
<small id =”header” class=”headerclass”> Some small text </small> – small text which is styled by the class headerclass and the id header.
<small style=”color:#F00″>Some small text</small> – small text which has a custom colour of red.
<small dir=”rtl”>Some small text</small> – small text where the text reads from right to left.
<small lang=”uk”>Some small text</small> – small text where the language has been tagged as UK.
<small title=”ptitle”>Some small text</small> – small text where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <small> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.
The h4 html tag
Overview
In HTML h tags stand for heading and this is split into 6 different h tags (h1, h2, h3, h4, h5 and h6). The <h4> tag itself is considered to be a small repeating sub header for a webpage. By default it is displayed as bold version of the body text and smaller than the <h3> header. As with all h tags it is considered important for SEO.When text is put between the opening and closing <h4> tag it is displayed as a Small heading. Unlike <h1> a <h4> tag can be used multiple times on a webpage as its job is to be the heading for a web pages sub topics.
Basic Usage
<h4>Small header text</h4>
Any text between the opening and closing tag will be displayed as a small heading.
Advance Usage
It is possible to style and add functionality to the <h4> tag, this is done by adding an attribute to after the h4 in the opening <h4> tag
Attributes allowed for the <h4>tag include :-class, dir, id, lang, style and title.
In most cases class and id are used and its basic usage is shown below
<h4 id=”header”>Small header text</h4>
With all attributes there is a space after the initial h4 then the attribute name, then an equal’s sign and the identifier of the attribute in double quotes.
Both id and class attributes refer to CSS styling of the element and is either stored in the <head> of the webpage on in an external file.
With id this usually refers to a single instance on a page where as class usually refers to a repeating element on a page, it is for this reason for the <h4> tag the class attribute is nearly always used over the id attribute although in practice it makes no difference.
The attribute style allows you to include css style information for a single <h4> tag.
The dir attribute allows for left reading and right reading text, lang allows you to specify a language for the tag and title allows you to include extra information for a tag.
It is possible to attach scripts to tags, as well adding functionality to a webpage, these scripts tend to be written in Javascript and therefore outside the scope of this document
Examples
<h4>Small header text</h4> – basic usage example.
<h4 id=”header”>Small header text</h4> – heading 4 which is styled by the id header.
<h4 class=”headerclass”> Small header text </h4> – heading 4 which is styled by the class headerclass.
<h4 id =”header” class=”headerclass”> Small header text </h4> – heading 4 which is styled by the class headerclass and the id header.
<h4 style=”color:#F00″>Small header text</h4> – heading 4 which has a custom colour of red.
<h4 dir=”rtl”>Small header text</h4> – heading 4 where the text reads from right to left.
<h4 lang=”uk”>Small header text</h4> – heading 4 where the language has been tagged as UK.
<h4 title=”ptitle”>Small header text</h4> – heading 4 where the tag has been titled ptitle.
Final Thoughts
Touching on just the surface of the <h4> HTML tag it is easy to see how versatile it is. To take full advantage of it an understanding of CSS is an advantage.