HTML5 Cheat Sheet

0 Flares Twitter 0 Facebook 0 Google+ 0 StumbleUpon 0 Pin It Share 0 0 Flares ×

Cheat sheet is a graphical method to summarize anything in a single image. It obviously save our time and make the things more live. When we think of organizing HTML5 tags, definitely cheat sheet is the best solution because most of us can’t make sure to carry every tag or snippet on memory. This is a cheat sheet which would help developers with a well-organized list of up to date HTML tags along with their meaning.

 html5 cheat sheet

Following are some examples showing the various HTML elements. It would help the newbie:

Hyperlink

<!DOCTYPE html>

<html lang=”en”>

<head>

   <title>HTML example</title>

</head>

<body>

<p><a href=”http://www.hostingreviewbox.com/”>HostingReviewBox</a></p>

   <p><a href=”../images/html.jpg”><img src=”../images/html-thumb.jpg” alt=”Cheat Sheet “></a></p>

   <p><a href=”http://www.google.com/”>Google Search</a></p>

</body>

</html>

Heading h1- h6

<!DOCTYPE html>

<html lang=”en”>

<head>

<meta charset=”UTF-8″>

   <title>Example-HTML headings</title>

</head>

<body>

   <h1>level 1</h1>

   <h2>level 2</h2>

   <h3>level 3</h3>

   <h4>level 4</h4>

   <h5>level 5</h5>

   <h6>level 6</h6>

</body>

</html>

Paragraph

<!DOCTYPE html>

<html lang=”en”>

<head>

   <meta charset=”UTF-8″>

   <title> HTML Paragraphs</title>

</head>

<body>

<p><b>This is bold Text</b></p>

   <p><code> computer code</code></p>

   <p><em>This is emphasized text</em></p>

   <p><i>This is italic text</i></p>

   <p><small>This is small text</small></p>

   <p><mark>This is marked text</mark></p>

   <p><strong>This is strongly emphasized text</strong></p>

   <p>This is <sub>subscript</sub> and <sup>superscript</sup></p>

   <p><ins>Inserted to the document</ins></p>

   <p><del>Deleted from the document</del></p>

</body>

</html>

 

Simple Table

<!DOCTYPE html>

<html lang=”en”>

<head>

   <meta charset=”UTF-8″>

   <title>HTML Table</title>

</head>

<body>

<table border=”1″>

       <thead>

           <tr>

               <th>No.</th>

               <th>Name</th>

               <th>Email</th>

           </tr>

       </thead>

       <tbody>

           <tr>

               <td>1</td>

               <td>Bryan</td>

               <td>bryan@mail.com</td>

           </tr>

           <tr>

               <td>2</td>

               <td>Jason Hope</td>

               <td>jason@mail.com</td>

           </tr>

           <tr>

               <td>3</td>

               <td>John Dasher</td>

               <td>jhon@mail.com</td>

           </tr>

       </tbody>

   </table>

</body>

</html>

About Andrew Smith

has written 715 post in this blog.

Andrew Smith works as an editor for BestDesignTuts.com

Comments
  1. Simonsandrew
  2. Alex

Leave a Reply

Your email address will not be published. Required fields are marked *

 

Get a Quote from Top Web Agency in the World