Blockquote-ku Yang Cantik

Blockquote merupakan salah satu bagian yang terdapat dalam template blog. Blockqute atau sering saya sebut dengan tanda petik merupakan suatu bagian yang berguna untuk menandai sesuatu hal yang penting. Ada sebagian orang yang menggunakannya untuk memposting kode-kode html. Blockquote biasanya menjorok kedalam sehingga terlihat jelas perbedaan antara area blockquote dengan yang lainnya. Semua itu tujuannya untuk membantu para pembaca bahwa dalam artikel kita terdapat sesuatu yang penting. Nah...untuk lebih membantu membedakan blockquote dengan bagian posting lainnya, kita dapat membuatnya jauh lebih cantik sesuai dengan yang kita inginkan.
Kita bisa menambahkan garis pada area blockquote kita, seperti ini:


Untuk membuat blockquote tersebut, tambahkan kode dibawah ini kedalam template kita.

blockquote{
background-color: transparent;
border-top: 3px double #DC143C;
border-bottom: 3px double #DC143C;
padding: 5px;
font-style: oblique;
font-size: 1em;
margin-left: 5%;
margin-right: 5%;
}

Warna garis dapat diganti sesuai dengan selera sobat. Ganti kode HTML warna (#DC143C) dengan kode html warna yang sobat inginkan. Untuk referensi kode warna, sobat dapat melihat artikel saya sebelumnya......"Color Generator Software".

Pilihan lainnya, kita dapat menambahkan sebuah gambar yang kita suka kedalam blockquote kita. Saya mencoba menambahkan blockqute dengan gambar berikut
      dan hasilnya akan seperti ini:

Untuk membuat blockquote seperti itu masukkan kode html berikut kedalam template kita.

blockquote {
background: transparent url(your upload picture URL) repeat-x $startSide top;
padding: 5px;
font-style: oblique;
font-size: 1em;
margin-left: 5%;
margin-right: 5%;
}

Ganti kata-kata"your upload picture URL" dengan alamat url gambar sobat. Apabila sobat menyukai gambar bintang-bintang diatas, cukup klik kanan lalu "save as" dan kemudian upload gambar tersebut. Itu hanya saran saja....sobat bisa mengubahnya menjadi yang lain, seperti ini mungkin:


Semoga bermamfaat

tipsandcara

Print this post

Bookmark this post: