Tutorial Bina Blog: Letak Kotak Berwarna Pada Blockquote

Entri sebelum ini ada menerangkan apakah yang dimaksudkan dengan Blockquote. Kebiasaannya default warna background Blockquote adalah putih. Ok tutorial kali ini akan menunjukkan pada anda cara nak letak kotak berwarna pada petikan Blockquote.

* Kepada pengguna simple template, sila rujuk tutorial ini untuk cara letak kotak pada petikan blockquote.

1) Sign in akaun blogger

2) Dashboard > Design > Edit HTML > Tick kotak "Expand Widget Template"

3) Dengan menggunakan ctrl + F (tekan serentak pada keyboard), cari kod

]]></b:skin>

4) Kemudian copy paste kod di bawah sebelum kod ]]></b:skin> tadi

.post blockquote {
background:#FFCCCC;
padding: 5px;
Border: 2px dashed #FF0099;

moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
colour:#FF0099;
}

Rupa kod korang akan jadi camni:

.post blockquote {
background:#FFCCCC;
padding: 5px;
Border: 2px dashed #FF0099;

moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
colour:#FF0099;
}

]]></b:skin>

Nota:
FFCCCC - warna background kotak blockquote. Rujuk kod warrna di bawah
2 - ketebalan garisan border kotak
dashed - style garisan border. Sama ada dashed, solid atau dotted

solid adalah garisan lurus, ___________

dotted adalah garisan titik-titik, …………………….

dashed adalah garisan putus-putus, _ _ _ _ _ _ _

FF0099 - warna garisan border. Rujuk kod warna di bawah
Kod warna purple - bentuk kotak border. Anda boleh pilih di sini

( untuk paparan lebih besar, klik di sini)

5) Save dan lihat hasilnya.

Selamat mencuba! :)

Special: