Href on any element

The href attribute transforms an anchor (A element) into a hyperlink. With Sircl, the href can be used on any element. In this example, we'll make hyperlinks of table rows.

In this example, each table body row is clickable as a href attribute on the table row element has turned the rows into hyperlinks:

<table class="table table-hover">
  <thead>
    <tr>
      <td>Name</td>
      <td>Title</td>
    </tr>
  </thead>
  <tbody>
    <tr href="/Profile/LizaDonnovan">
      <td>Liza Donnovan</td>
      <td>CEO</td>
    </tr>
    <tr href="/Profile/PeterJohnson">
      <td>Peter Johnson</td>
      <td>Secretary</td>
    </tr>
  </tbody>
</table>

(The table has been styled with Bootstrap classes.)

You can apply styling to elements having a href attribute as follows:

<style>
  [href] {
    cursor: pointer;
  }
</style>

The ability to transform any element into a hyperlink is practical, but you should be aware that search engines may ignore href attributes if they do not appear on anchor (A) elements.

The href attribute behaves identical to the onclick-load attribute. Prefer the onclick-load attribute when the behaviour of a hyperlink is desired, without the look or styling of a hyperlink.