banner



How To Code Html 5

If you're looking for some HTML codes to spice up your website, you've come to the right place. You will find a variety of HTML tags and tips to assist you below.

To copy and paste the HTML codes from the HTML chart below into the HTML of your web page, place your mouse pointer over the beginning of the HTML code you would like to copy.  Next, click and hold your left mouse button and drag your mouse over all the HTML code you would like to copy ( Example of highlighted text ). Your HTML code should now be highlighted. Go to "Edit" - "Copy" on your web browser's toolbar and then place your cursor within your HTML code where you would like to place the code. Right click on your mouse and go to "Paste." Your HTML code should now be displaying within your HTML document.

Name

HTML Tag

HTML Code Example

Browser View

HTML Heading 1
HTML Heading 2
HTML Heading 3
HTML Heading 4
HTML Heading 5
HTML Heading 6
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<h1>Heading 1 Example</h1>
<h2>Heading 2 Example</h2>
<h3>Heading 3 Example</h3>
<h4>Heading 4 Example</h4>
<h5>Heading 5 Example</h5>
<h6>Heading 6 Example</h6>

Heading of HTML Document <head> <head>Contains elements describing the document</head> Nothing will show
HTML Horizontal Rule <hr> <hr />
Contents of your web page (Tip)

Contents of your web page
HTML Horizontal Rule <hr> <hr width="50%" size="3" /> Contents of your web page

Contents of your web page
HTML Horizontal Rule <hr> <hr width="50%" size="3" noshade /> Contents of your web page

Contents of your web page
HTML Horizontal Rule <hr>
(Internet
Explorer)
<hr width="75%" color="#ff0000" size="4" /> Contents of your web page

Contents of your web page
HTML Horizontal Rule <hr>
(Internet
Explorer)
<hr width="25%" color="#6699ff" size="6" /> Contents of your web page

Contents of your web page
HTML Hypertext Markup Language <html> <html>
<head>
<meta>
<title>Title of your web page</title>
</head>
<body>HTML web page contents
</body>
</html>
Contents of your web page
HTML Italic <i> <i>Example</i> Example
HTML Image <img> <img src="Earth.gif" width="41" height="41" border="0" alt="text describing the image" /> a sentence about your site (Tip)
HTML Input Field <input> Example:

<form method=post action="/cgi-bin/example.cgi">
<input type="text" size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>

HTML Input Password <input> <form method=post action="/cgi-bin/example.cgi">
<input type="password" size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>
HTML Input
(Background Color)
<input>
(Internet Explorer)
Example:

<form method=post action="/cgi-bin/example.cgi">
<input type="text" style="color: #ffffff; font-family: Verdana; font-weight: bold; font-size: 12px; background-color: #72a4d2;" size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>

HTML Input
(Image Submit Button)
<input> Example:

<form method=post action="/cgi-bin/example.cgi">
<table border="0" cellspacing="0" cellpadding="2"><tr><td bgcolor="#8463ff"><input type="text" size="10" maxlength="30"></td><td bgcolor="#8463ff" valign="Middle"> <input type="image" name="submit" src="yourimage.gif"></td></tr> </table>
</form>

HTML Input
(Comment Box)
<input> Example:

<form method=post action="/cgi-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>

HTML Input
(Radio Button)
<input> Example:

<form method=post action="/cgi-bin/example.cgi">
Select an option:<br>
<input type="radio" name="option"> Option 1
<input type="radio" name="option" checked> Option 2
<input type="radio" name="option"> Option 3
<input type="Submit" value="Submit">
</form>

HTML Input
(Checkbox)
<input> Example:

<form method=post action="/cgi-bin/example.cgi">
Select an option:<br>
<input type="checkbox" name="selection"> Selection 1
<input type="checkbox" name="selection" checked> Selection 2
<input type="checkbox" name="selection"> Selection 3
<input type="Submit" value="Submit">
</form>

HTML List Item <li> 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>

Example 1: (Tip)
  • List item 1
  • List item 2
  • List item 3


Example 2:

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4
HTML Link <link> <head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
HTML Scrolling Text <marquee>
(Internet
Explorer)
<marquee bgcolor="#cccccc" loop="-1" scrollamount="2" width="100%">Example Marquee</marquee> Example Marquee (Tip)
HTML 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>
  • List item 1
  • List item 2
  • List item 3
HTML Meta <meta> <meta name="Description" content="Description of your site">
<meta name="keywords" content="keywords describing your site">
Nothing will show (Tip)
HTML Meta <meta> <meta HTTP-EQUIV="Refresh" CONTENT="4;URL=http://www.yourdomain.com/"> Nothing will show (Tip)
HTML Meta <meta> <meta http-equiv="Pragma" content="no-cache"> Nothing will show (Tip)
HTML Meta <meta> <meta name="rating" content="General"> Nothing will show (Tip)
HTML Meta <meta> <meta name="robots" content="all"> Nothing will show (Tip)
HTML Meta <meta> <meta name="robots" content="noindex,follow"> Nothing will show (Tip)

Name

HTML Tag

HTML Code Example

Browser View

HTML Ordered List <ol> Numbered

<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
</ol>

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>
<li>List item 4</li>
</ol>

Numbered
  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Numbered Special Start

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Lowercase Letters

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Capital Letters

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Capital Letters Special Start

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Lowercase Roman Numerals

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Capital Roman Numerals

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4

Capital Roman Numerals Special Start

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4
HTML Listbox Option (Drop Down Box)
<option> <form method=post action="/cgi-bin/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>
Select an option: (Tip)

HTML Mailto Email Link <a> <a href="mailto:you@yourdomain.com">Email Link</a> Email Link
HTML Paragraph <p> This is an example displaying the 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>
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>

This is an example displaying the use of the HTML 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.

HTML Small (Text) <small> <small>Example</small> Example (Tip)
HTML Deleted Text <strike> <strike>Example</strike> Example
HTML Strong <strong> <strong>Example</strong> Example
HTML Table <table> Example 1:

<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 1: (Tip)
Column 1 Column 2


Example 2: (Tip)

Column 1 Column 2


Example 3: (Tip)

Column 1 Column 2
Row 2 Row 2
HTML Table Data <td> <table border="2" cellpadding="2" cellspacing="2" width="100%">
<tr>
<td>Column 1</td>
<td>Column 2</td>

</tr>
</table>

Column 1 Column 2
HTML Table Header <th> <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>
<td>Row 4</td>
</tr>
</table>
</div>
Column 1 Column 2 Column 3
Row 2 Row 2 Row 2
Row 3 Row 3 Row 3
Row 4 Row 4 Row 4
HTML Document Title <title> <title>Title of your HTML page</title> Title of your web page will be viewable in the title bar. (Tip)
HTML Table Row <tr> <table border="2" cellpadding="2" cellspacing="2" width="100%">
<tr>
<td>Column 1</td>
<td>Column 2</td>
</tr>
</table>
Column 1 Column 2
HTML Teletype <tt> <tt>Example</tt> Example
HTML Underline <u> <u>Example</u> Example
HTML Unordered List <ul> 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>
Example 1:
  • List item 1
  • List item 2


Example 2:

  • List item 1
  • List item 2
    • List item 3
    • List item 4

For additional information about coding in HTML, see the 'How to Code in HTML' section.

How To Code Html 5

Source: https://www.web-source.net/html_codes_chart.htm

Posted by: morristwounds.blogspot.com

0 Response to "How To Code Html 5"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel