Sunday, February 23, 2014

Cara membuat border di bawah link dan gambar

Pada kesempatan kali ini taukahbahwa.blogspot.com akan membahas artikel tentang Cara membuat border di bawah link dan gambar. Semoga dengan berita Cara membuat border di bawah link dan gambar akan menambah pengetahuan bagi anda pembaca setia taukahbahwa.blogspot.com

Cara membuat border di bawah link dan gambar
Kalau melihat gambar di atas di bawahnya ada border dashed warna hitam, jadi aku akan menuliskan cara membuat border di bawah link dan gambar. Contohnya di blog aku ini saja kalau cursor menyentuh link dan gambar akan keluar border dan warna hitam. Cara membuatnya sebagai berikut:

1.Dashboard > Template >edit HTML
2.Expand Template Widget dan tick F3 atau CTRL + F dan cari kode:
a:hover {   (paling atas)
Hapus dulu kalau di bawah kode a:hover { ada kode berikut (contoh):

color:#000000;
text-decoration: underline;
3.Letakkan kode berikut di bawah kode di atas (cari kode a:hover { yang ada di bawah kode /* Content karena mungkin kode itu lebih dari satu xD.
color:#000000;
border-radius:3px;
border-bottom: 1px dashed #000000;
}
Warna pink adalah kode warna link bisa ditukar dengan warna lain, warna orange 1px itu ketebalan border, warna merah dashed itu jenis border nya bisa ditukar dotted, dll dan warna biruitu kode warna border nya.

Kalau di atas dan bawah link dan gambar mau ditaruh border kodenya jadi seperi di bawah ini:
a:hover {
color:#00AEAE;
border-radius:3px;
border-top: 1px dashed #EA0000;
border-bottom: 1px dashed #EA0000;
}
Contoh gambarnya seperti di bawah ini 
Cara membuat border di bawah link dan gambar
4.Terakhir tekan preview atau pratinjau dulu baru simpan template.

Dapatkan berita terupdate dan unik setiap saat hanya di taukahbahwa.blogspot.com
Homepage|http://taukahbahwa.blogspot.com

No comments:

Post a Comment

jangan lupa tinggalkan komentar .... trimakasih atas kunjungannya