Membuat Kotak Teks/Kotak Script Di Dalam Postingan

Farhan Share - Sobat farhan pada postingan kali ini farhan akan berbagi tentang cara membuat Kotak Teks/Kotak Script di dalam postingan. Sebenarnya apa sih kotak script dan kegunaanya? Ya, sobat farhan kotak script atau yang sering disebut kotak teks adalah text area untuk membatasi teks yang dianggap penting seperti point dari artikel, inti dari cerita, maupun script dalam memberikan tutorial blog, contoh teks area atau kotak teks sobat farhan bisa lihat pada gambar di atas. Kegunaanya adalah seperti yang farhan sebutkan tadi, misalnya untuk pembatas antara teks script dan teks biasa dalam memberikan Tutorial Blog, agar  pengunjung tidak bingung dalam membedakan yang mana teks biasa dan yang mana script, dll. Baik, sobat farhan di bawah ini farhan sudah persiapkan contoh kotak teks dan kode scriptnya, di simak baik-baik ya.

1. SOLID

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 1px solid #000000; background-color:#A9F5A9; padding: 5px;width: 330px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

2. DOTTED

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 1px dotted #000000; background-color:#81F7F3; padding: 5px;width: 330px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

3. DASHED

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 1px dashed #faac58; background-color:#F4FA58; padding: 5px;width: 330px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

4. DOUBLE

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 4px double #000000; background-color:#BDBDBD; padding: 5px;width: 340px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

5. GROOVE

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 4px groove #000000; background-color:#FFFFFF; padding: 5px;width: 340px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

6. OUTSET

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:
<div style="border: 4px outset #000000; background-color:#FA5858; padding: 5px;width: 340px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

7. RIDGE

Tampilan:

Tulisan/script HTML atau artikel blog letakkan disini

Kode:

<div style="border: 4px ridge #faac58; background-color:#FAAC58; padding: 5px;width: 340px;">Tulisan/script HTML atau artikel blog letakkan disini</div>

Format Postingan:

<div style="border: 1px dotted #000000; background-color:#81F7F3; padding: 5px;width: 330px;">Teks Script/Teks Area</div>

Catatan : Ganti kode yang berwarna merah dengan teks script atau tulisan yang kamu ingin berikan Kotak Script/Kotak Teks

Demikian sobat farhan artikel tentang Cara membuat kotak teks/kotak script di dalam postingan, semoga bermanfaat, bila ada pertanyaan comment di bawah.