Saturday, May 3, 2014

Cara Membuat Garis Tepi dan Warna Latar Tulisan di Postingan Blog

Cara Membuat Garis Tepi dan Warna Latar Tulisan di Postingan Blog

Halo juragan... Seringkali kita perlu menulis artikel dengan memberikan garis tepi (border) maupun warna latar (background colour) pada beberapa kalimat penting maupun bagian penting dari artikel kita agar para pembaca lebih mudah memahaminya. Misalnya kata-kata penting maupun kode script HTML yang seringkali diberi warna latar atau garis tepi yang berfungsi untuk menegaskan bacaan penting kepada para pembaca.

Dan juga agar script HTML bisa menyala warna biru ketika di klik oleh pembaca yang ingin mengcopy kode script yang kita berikan.

Berikut ini ada beberapa pilihan yang bisa anda gunakan untuk keperluan tersebut. Pilihlah mana yang anda perlukan dan anda hanya tinggal mengganti kode warna saja sesuai dengan keinginan anda.

* Pastekan kode script yang anda inginkan di bawah ini di area postingan pada bagian HTML (bukan Compose).


  • Pertama adalah cara agar script HTML bisa menyala atau mem-blok berwarna biru secara otomatis ketika di klik oleh pembaca yang ingin mengcopy kode script HTML.


Jangan lupa ditutup dengan </textarea>

**********


  • Berikutnya adalah cara membuat garis tepi (border) maupun warna latar (background colour) untuk kalimat penting pada isi bacaan di area postingan.

<div style="border: 1px solid #8A9B9B; padding: 10px;">
TULISAN ANDA DISINI
</div>

<div style="border: 3px solid #000000; padding: 10px;">
TULISAN ANDA DISINI
</div>

<div style="border: 3px dotted #000; padding: 10px;">
TULISAN ANDA DISINI
</div> 

<div style="border: 5px #000 double; padding: 10px;">
TULISAN ANDA DISINI
</div>

<div style="border: 4px #2E2EFE ridge; padding: 10px; background-color: #F6CEF5; ">
TULISAN ANDA DISINI
</div>

<div style="border: 1px #F6CEF5 ridge; padding: 10px; background-color: #F6CEF5; ">
TULISAN ANDA DISINI
</div>

Selain bertujuan untuk memudahkan para pembaca memahami bagian penting dari artikel kita, hal-hal seperti ini bisa menambah penampilan postingan kita menjadi lebih keren. Begitulah. Selamat mencoba dan silakan di bookmark halaman ini agar jika sewaktu-waktu juragan memerlukan tinggal meluncur kesini... 
sumber: juragan cipir.com

No comments:

Post a Comment