Bagi sobat yang masih setia dengan penggunaan blockquote, saya coba
membuat penomoran otomatis pada Blockquote. CSS nya saya modifikasi dari
tutorial DTE dalam 'membuat penomoran otomatis pada tag PRE'.
Simpan kode ini di atas
Sekarang Copas code ini di atas </body> :
1. Blok teks yang ingin dijadikan blockquote.
2. kemudian tekan tombol berikut
Sekian dulu ya, Semoga Bermanfaat.
Jangan lupa untuk coment walaupun sedikit.
Simpan kode ini di atas
]]></b:skin>
atau </style>
blockquote { background-color:#eee; font:normal normal 12px/14px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important; color:#444; overflow:auto; margin:0 0 1em; padding:1em; } blockquote, blockquote .line-number { /* Ukuran line-height antara teks di dalam tag <blockquote> dan <span class="line-number"> harus sama! */ font:normal normal 12px/14px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important; display:block; white-space:pre; } blockquote .line-number { float:left; margin:-1em 1em -1em -1em; text-align:right; background-color:#f1f1f1; color:#acacac; padding:1em .2em 1em .2em; border-right:1px solid #e0e0e0; } blockquote br { display:none; } blockquote .line-number span { display:block; padding:0 .7em 0 1em; } blockquote .cl { display:block; clear:both; }
Sekarang Copas code ini di atas </body> :
<script type='text/javascript'> //<![CDATA[ var pre = document.getElementsByTagName('blockquote'), pl = pre.length; for (var i = 0; i < pl; i++) { pre[i].innerHTML = '<span class="line-number"></span>' + pre[i].innerHTML + '<span class="cl"></span>'; var num = pre[i].innerHTML.split(/\n/).length; for (var j = 0; j < num; j++) { var line_num = pre[i].getElementsByTagName('span')[0]; line_num.innerHTML += '<span>' + (j+1) + '</span>'; } } //]]> </script>
Cara menggunakan Blockquote :
1. Blok teks yang ingin dijadikan blockquote.
2. kemudian tekan tombol berikut
Sekian dulu ya, Semoga Bermanfaat.
Jangan lupa untuk coment walaupun sedikit.
0 komentar:
Post a Comment