Cara memperganteng dengan navigasi
Selasa, 06 Maret 2012
0
komentar
Untuk menciptakan navigasi halaman blog dengan tampilan yang luar biasa ganteng seperti ini, pertama-tama masuklah ke tab Rancangan kemudian pilih Edit HTML.
Cari kode yang tampak seperti ini:
]]></b:skin> atau seperti ini:
</style> Salin kode di bawah ini, kemudian letakkan tepat di atasnya:
#blog-pager {line-height:40px !important;}
#blog-pager-older-link a,
#blog-pager-newer-link a,
#blog-pager a.home-link {
padding:5px 10px;
margin:2px 7px;
text-align:center;
background:#278100 url(http://4.bp.blogspot.com/-445SkQ6EG9g/TkIRpduys0I/AAAAAAAAAqI/1uUZnx_-3FY/s1600/rumput.png) repeat-x 0 -1px;
border:2px solid #fff;
font:bold small Arial,Sans-Serif;
text-decoration:none;
color:#fff;
text-shadow:1px 1px 1px #278100,0 0 5px #278100;
-webkit-box-shadow:0 1px 3px #aaa;
-moz-box-shadow:0 1px 2px #aaa;
box-shadow:0 1px 2px #aaa;
-webkit-border-radius:.5em;
-moz-border-radius:.5em;
border-radius:.5em;
}
#blog-pager-older-link a:hover,
#blog-pager-newer-link a:hover,
#blog-pager a.home-link:hover {
position:relative;
top:-1px;
color:#000;
background-position:0 0;
}
#blog-pager-older-link a:active,
#blog-pager-newer-link a:active,
a.home-link:active {
position:relative;
top:1px;
background-position:0 -2px;
}Klik Simpan Template.
Warna dominan yang disarankan untuk mengimbangi tampilannya adalah:
#f5f8d8 Hasil tampilan akhirnya kira-kira akan tampak seperti ini:
0 komentar:
Posting Komentar