Membuat Kotak Dalam Posting

Suatu saat kita menulis artikel yang di dalamnya diperlukan sebuah kotak untuk sebuah keperluan. Contoh kotaknya seperti di bawah ini:



Buah manggis di atas kertas,
kalau menangis jangan keras-keras

Namun tidak semua orang bisa melakukannya. Sekarang andapun bisa dengan mengikuti cara sebagai berikut:
Silahkan kopi kode HTML ini dan letakkan dimana kotak akan ditampilan:

<p style="border-right: #6c7a7d 1px inset; padding-right: 30px; border-top: #6c7a7d 1px inset; padding-left: 30px; margin-left: 20px; border-left: #6c7a7d 1px inset; margin-right: 70px; border-bottom: #6c7a7d 1px inset"><font color="#ff0000">Buah manggis di atas kertas,
kalau menangis jangan keras-keras</font></p>


Sebagai keterangan:
- border-right = garis pinggir kotak sebelah kanan
- border-left = garis pinggir kotak sebelah kiri
- border-top = garis pinggir kotak sebelah atas
- border-bottom = garis pinggir kotak sebelah bawah
- #6c7a7d; #ff0000 = kode warna, rubah sesuai keinginan
- 1px inset = ketebalan garis pinggir kotak, rubah sesuai keinginan
- padding-right = jarak tulisan dengan garis pinggir kotak sebelah kanan
- padding-left = jarak tulisan dengan garis pinggir kotak sebelah kiri
- margin-right = jarak kotak dengan pinggir posting sebelah kanan
- margin-left = jarak kotak dengan pinggir posting sebelah kiri
- 20px; 30px; 70px = satuan jarak, rubah sesuai keinginan
- font color = warna teks,
Selamat mencoba semoga berhasil

0 komentar

Posting Komentar