HTML5 Library

This is my personal reference of HTML5 code however if you find it helpful please share it with others.

Want to find something specific on this page? Simply press ⌘-F if you’re on a Mac or Ctrl + F if you’re on Windows or Linux to bring up your browser’s search bar. Also you can use the table of contents below.

Table of Contents
(Some browsers do not support this feature. More info in FAQ.)

• Showing HTML Code
• Modifying Text
• Adding notes to your HTML code
• Adding links
• Jumping to specific parts of a page via anchors

Showing HTML Code
This is used for showing html code. You simply have to replace < and > with their ascii counterparts which are &lt; and &gt; respectively.

Example:

&lt;tag&gt;

becomes

<tag>

Modifying Text
This is done by using the <span style=”text modifier here”></span> tags along with some others for italics, bold, strike-through etc.

Modifiers for span tags are as follows:
Underline – text-decoration:underline;
Font Size – font-size:20pt;   or   font-size:xx-small;
Color – color:white;   or   color:#FFFFFF;
Highlight – background-color:white;   or   background-color:#FFFFFF;

Separate text tags are as follows:
Strike-through – <del></del>
Bold – <strong></strong>
Italics – <em></em>

Example:

<del><span style=”background-color:red;font-size:20pt;color:#000000″>this</span></del>

 

becomes

 

this

To change the strike-through color from default insert its tags within the span tag to take on the text color or use another set of span tags outside the del tags with the color you want.

Example:

<span style=”background-color:red;font-size:20pt;color:#000000″><del>this</del></span>

 
and
 

<span style=”color:yellow”><del><span style=”background-color:red;font-size:20pt;color:#000000″>this</span></del></span>

 

becomes

 

this

 
and
 

this

Adding notes to your HTML code
To do this you simply need to use <!–text here–> in your html code. This can sometimes take up 1 empty line space on your visible site.

Example:

<!–This not will not show if put in html–>

Adding links
To do this simply use the <a href=”url”>Visible link text</a> tags.

Jumping to specific parts of a page via anchors
This is used for jumping to specific parts on the current page or specific parts on another page. To do this the <a name=”id1″></a> tags are used where id1 is the name of the anchor. Simply place the anchor in your code where you want the top of the page to appear. To call on this anchor while on the same page you simply use the page link tags with just the anchor name as follows: <a href=”#id1″>Click me!</a> To call on an anchor from another page you must use the whole URL of the page with the anchor name at the end like so: <a href=”webpage-url/#id1″>Click me!</a>

Test font

this