Cascading Style Sheets/Breadcrumbs

Use the :before and :after pseudo elements with generated content to generate breadcrumbs

<!doctype html>
<html>
  <head>
    <title>Breadcrumb Test</title>
    <base href="./" />
    <style type="text/css">
      label:before { content: attr(title); text-decoration: underline; color: blue; }
      label:after { content: ">"; }
      label { position:relative; }
      #url { opacity:0; position: absolute; left: 0; }
    </style>
  </head>
  <body>
    <form action="./">
    <label for="url" title="Here">
      <input type="image" id="url" />
    </label>
    </form>
  </body>
</html>

  This article uses material from the Wikipedia page available here. It is released under the Creative Commons Attribution-Share-Alike License 3.0.


Cascading_Style_Sheets/Breadcrumbs
 

Manage research, learning and skills at IT1me. Create an account using LinkedIn to manage and organize your IT knowledge. IT1me works like a shopping cart for information -- helping you to save, discuss and share.


  Contact Us  |  About IT1me.com |  IT Training & References |  IT Careers |  IT Hardware |  IT Software |  IT Books