Selamat datang di CaraGampang.Com

Cara ModifIkasi Blockquote Paling Keren Dengan CSS

Sabtu, 07 Juli 20120 komentar

Memodifikasi Blockquote caranya sangatah simpel anda tinggal simpan kode di bawah ini di atas kode ]]</b:skin>. oke sobat biar lebih jelassilahkan ikuti langkah - langkahnya dibawa ini:

1. Masuk di dasbor blogger
2. Klik Rancangan / Template
3. Klik Edit HTML
4. Klik Prooced / Lanjutkan ( jika menggunakan editor baru )
5. Cari kode ]]></b:skin>
6. Setelah ketemu silahkan simpan kode css di bawah ini di atas kode tersebut.
<pre class="name:css">
.post blockquote {
margin-left: 15px;
padding: 5px 5px 5px 10px;
background: #cfcb9d;
border: #ada171 solid 1px;
font: normal 12px/14px Monaco, Monospace;
border-left: #ada171 solid 5px;
position: relative
}
.post blockquote[rel] {
padding-top: 25px;
}
.post blockquote[rel]::before {
content: attr(rel);
font: bold 12px/22px Arial, Sans-Serif;
color: white;
background-color: #b4a97e;
padding: 0 10px;
position: absolute;
top: 0;
right: 0;
left: 0;
text-transform: uppercase
}</pre>


7. Lalu klik SIMPAN.

Nah saat anda menulis di postingan dan menambahkan blockquote di postingan pasti nanti kodenya seperti ini,

<blockquote>
Disini kata - kata anda
</blockquote>

Nah sekarang anda hanya perlu menambahkan kode seperti ini rel="Contoh" pada kode pembuka blockquote, jadi nanti kodenya seperti ini

<blockquote rel="Contoh">
Disini kata - kata anda
</blockquote>

Nah kalau sudah seperti itu maka nanti nama blockquote nya akan muncul, ganti juga kata contoh dengan kata - kata anda. selamat berkreasi dengan nama blockquote nya ya. emm jangan lupa untuk melihat kodenya anda perlu beralih dari mode Compose ke Mode HTML atau Edit HTML Nih screenshot nya.


Nah begitulah Cara ModifIkasi Blockquote Paling Keren semoga bermanfaat



source :  http://sin1aja.blogspot.com
Share this article :

Posting Komentar

 
Support : Cara Gampang | Creating Website | Johny Template | Mas Templatea | Pusat Promosi
Copyright © 2011. T N T Blog - All Rights Reserved
Template Created by Creating Website Modify by CaraGampang.Com
Proudly powered by Blogger