Gadget Tools

Custom Dasar Blogspot Body dan Link

Custom Dasar Blogspot Body dan Link

Kumpulan Tips dan Triks Internet dan Blogspot - Custom Blogspot Dengan CSS Bagian 1. Edit Blog dengan code-code CSS agar lebih menarik dan lebih Ringan. Berikut ini beberapa Tulisan yang bisa Anda simak tentang Kustomisasi Blog Anda dengan Script CSS.

Custom Dasar Blogspot Body dan Link

Langkah Awal :
Log in to dashboard ? Layout ? Click ‘Template Designer’ link ? Advanced ? Add CSS

Background
BACKGROUND COLOR
Untuk menggunakan Background dengan Warna Anda bisa mengganti warna sesuai dengan keinginan Anda seperti dibawah ini :

body {
background: #FCF9F8;
}

BACKGROUND IMAGE

body {
background:#FCF9F8 url(‘http://www.yourdomain.com/yourbgimage.png‘) repeat right top;
}

Font
Untuk mengganti / kustomisasi Font anda juga bisa menggantinya seperti berikut ini

body {
font-family:Helvetica, Arial, sans-serif;font-size:12px;color:#1a1a1a;text-align:left;}

Font-size : pengaturan untuk ukuran font
Color : Pengaturan untuk Warna Font yang juga bisa Anda rubah disesuakan dengan template/kesukaan.
Text-align : merupakan suatu aturan untuk mengatur rata text, bisa anda ganti : center, left atau right.

LINKS
link bisa anda rubah warna dan aturan lain seperti garis bawah dihilangkan / yang lain.

a:link {color:#1A1A1A;
text-decoration:none;
font-weight:bold;}
a:visited {color:#1A1A1A;
text-decoration:none;
font-weight:bold;}
a:hover {color: #B7ABA3;
text-decoration:underline;
font-weight:bold;}
a:active {color:#1A1A1A;
text-decoration:none;
font-weight:bold;
}

text-decoration:none :  Berfungsi untuk menghilangkan garis bawah yang biasanya muncul pada link.

FINAL
Sehingga jika dirangkai menjadi satu keseluruhan akan menjadi seperti berikut ini

body {
background:#FCF9F8 url(‘http://www.yourdomain.com/yourbgimage.png‘) repeat right top;
font-family:Helvetica, Arial, sans-serif;
font-size:12px;
color:#1a1a1a;
text-align:left;}
a:link {color:#1A1A1A;
text-decoration:none;
font-weight:bold;}
a:visited {color:#1A1A1A;
text-decoration:none;
font-weight:bold;}
a:hover {color: #B7ABA3;
text-decoration:underline;
font-weight:bold;}
a:active {color:#1A1A1A;
text-decoration:none;
font-weight:bold;
}

Semoga Bermanfaat Bagi rekan-rekan yang masih dalam tahap belajar Blogspot.

Follow my blog with Bloglovin

Go to link Download