tag pre pada css trick

Diposting oleh: Admin Referensi Blog pada: Waktu On Line :kak:

SILAHKAN DI EDIT......


<pre rel="CSS"><code>.waargh {
  width:98%;
  padding:10px 1%;
  font:bold 22px/30px Arial,Sans-Serif;
}</code></pre>

<pre rel="JQuery"><code>$(function() {
    $('a').click(function() {
        $('body').remove(); // Whaatt??!!!!
    });
});</code></pre>

<pre><code>// Lorem ipsum dolor sit amet...</code></pre>


body {
  padding:30px;
  background-color:#f5f5f5;    
}

pre {
  background-color:#333;
  font:normal 12px/14px Monaco,Monospace;
  color:#ccc;
  padding:10px 15px;
  margin:0px 0px 10px;
  position:relative;
}

pre[rel] {
  padding-top:32px;   
}

pre[rel]:before {
  content:attr(rel);
  font:bold 12px/22px Arial,Sans-Serif;
  color:white;
  background-color:#39f;
  padding:0px 10px;
  position:absolute;
  top:0px;
  right:0px;
  left:0px;    
}

DIK TAUFIQ , AUTHOR: DTE.WEB.ID

referensi blog

tag pre pada css trick

Tambahkan komentar Komentator