Cikgu Kacamata: Buat Border Pada Main Blog Blogger

Pada tutorial-tutorial sebelum ini CK ada menunjukkan bagaimana cara-cara Membuat Border Pada Ruangan Post, Membuat Border Pada Sidebar Gadget dan cara Membuat Border Pada Post Body.
Tutorial kali ini CK hendak menunjukkan cara membuat border pada main blog.

Langkah-langkah membuatnya:

1. Pergi ke "More options"

2. "Template" kemudian pilih "Customise"

"Copy" kod di bawah:

.content-outer {
border:5px dotted #cccccc;
}

Jika hendak lengkungkan keempat-empat penjuru border:

.content-outer {
border:5px dotted #cccccc;
border-radius:15px;
}

Jika hendak lengkungkan beberapa penjuru border:

.content-outer {
border:5px dotted #cccccc;
border-top-right-radius:15px;
border-top-left-radius:0px;
border-bottom-right-radius:0px;
border-bottom-left-radius:15px;
}

Nota:

Kod warna merah:
Untuk menambahkan/mengurangkan ketebalan border

Kod warna biru:
Untuk menukar jenis garisan border

*klik untuk mendapatkan jenis-jenis garisan border

Kod warna hijau:
Untuk menukar warna garisan border

*klik untuk mendapatkan kod-kod warna lain

Kod warna pink:
Untuk menambahkan/mengurangkan panjang lengkung pada semua penjuru border. Tidak digalakkan menambah panjang lengkung melebihi 15px

Kod warna aqua/cyan:
Untuk menambahkan/mengurangkan lengkung dan panjang lengkung bagi beberapa penjuru border. Set pada nilai "0" untuk tidak mempunyai lengkung. Tidak digalakkan menambah panjang lengkung melebihi 15px

3. Pada "Blogger Template Designer", klik butang "Advanced"

4. Scroll bawah sikit dan pilih "Add CSS"

5. Pada bahagian "Add custom CSS", "Paste" kod tadi dalam kotak berwarna merah dan jangan lupa TEKAN ENTER

6. Kemudian "Apply to Blog"

Selesai!

*sekiranya anda ingin kembali mengubah kod-kod ini dalam kotak Add custom CSS dan anda dapati kod-kod tersebut telah tiada, jangan panik...anda cuma perlu paste sahaja kod-kod ini dalam kotak Add custom CSS seperti biasa