Common HTML Tags

There are many tags in HTML that you can use to make your website. In the below example you can see several tags.

<h1>Learning HTML</h1>
<h2>This is a Smaller Heading</h2>

Link to: <a href="http://www.andynilson.com/" target="_blank">AndyNilson.com</a>

<br/>

<span>this is a span</span>
<span>this span is on the same line</span>

<br/>

<div style="color:#00ff00">this is a div </div>
<div style="color:#00fff0">this div in on the next line</div>

<button type="button" onclick="alert('you just clicked a button')">Click Me!</button>

<!-- this is how you add a comment in HTML -->

<table border="1" style="border-collapse: collapse;">
  <tr>
    <th>Name</th>
    <th>Website</th>
    <th>Twitter</th>
    <th>G+</th>
  </tr>
  <tr>
    <td>Andy</td>
    <td>andynilson.com</td>
    <td>@andy_nilson</td>
    <td>google.com/+AndyNilson123</td>
  </tr>
  <tr>    
    <td>Kevin</td>
    <td>javaclimber.com</td>
    <td>@javaclimber</td>
    <td>google.com/+KevinNilson</td>
  </tr>
</table>

try on plunker

The <h1>to <h6> tags are for headings.

<h1>this is a heading</h1>

• h1 is the biggest heading
• h2 is a smaller heading
• h6 is a smallest heading

The <a> tag defines a hyperlink, which is used to link from one page to another.

<a href="http://www.andynilson.com/" target="_blank">this is a link to my webpage.</a>

• in HTML links are defined as anchor tag
• href specifies a link's destination
• The target attribute specifies where to open the linked document
• a linked page is displayed in the current browser window if you do now specify a target
• _blank is a special target name that means always in a new window

Use <br/> to add a line brake.

The <span> tag is used to group inline-elements in a document.

<span>this is a span</span>

The <div> tag is a block elements in a document.

<div style="color:#00ff00">this is a div </div>

The button tag defines a clickable button. Inside a button element you can put text or images.

<button type="button" onclick="alert('you just clicked a button')">Click Me!</button>

The table tag defines an HTML table.

An HTML table consists of the table element and one or more <tr>, <th>, and <td> tags.

The <tr> element defines a table row, the <th> element defines a table header, and the <td> element defines a table cell.

<table border="1" style="border-collapse: collapse;">
  <tr>
    <th>Name</th>
    <th>Website</th>
    <th>Twitter</th>
    <th>G+</th>
  </tr>
  <tr>
    <td>Andy</td>
    <td>andynilson.com</td>
    <td>@andy_nilson</td>
    <td>google.com/+AndyNilson123</td>
  </tr>
  <tr>    
    <td>Kevin</td>
    <td>javaclimber.com</td>
    <td>@javaclimber</td>
    <td>google.com/+KevinNilson</td>
  </tr>
</table>

The image tag defines an image in an HTML page.

<img src="https://avatars2.githubusercontent.com/u/7111340?v=3&s=400">