Cara Membuat Script Box Keren di Postingan Blog
Cara Membuat Script Box Keren di Postingan Blog

Voizd.com
---
Voizd.com - Cara Membuat Script Box Keren di Postingan Blog, Cara Membuat Kotak Scroll terhadap HTML Blog - Dalam dunia blogging, script box / kotak skrip membuat jadi salah 1 komponen yg sangat sering diperlukan dalam penulisan artikel blog. Terlebih lagi bagi mereka yg menerapkan niche / topik seputar teknologi & coding.
Apa itu Script Box?
Dari katanya saja, mungkin sudah terbayang dipikiran Anda tentang pengertian dan definisi dari elemen tersebut. Ya, script box atau kotak skrip adalah elemen kotak yang bertugas untuk membungkus tulisan yang ada di dalamnya (biasanya berupa skrip atau kode).
Pada dasarnya, elemen pembungkus tersebut sangat mirip dengan syntax highlighter. Yang membedakan dua komponen tersebut hanya dari segi pemasangan, selebihnya bisa dikatakan mirip. Untuk lebih jelasnya,
Membuat kotak script mampu dikatakan sangat mudah. Dengan banyaknya jenis tampilan yg mampu digunakan, Anda bakal bebas memilih tampilan yg seperti bersama keinginan Anda.
Namun sebelum mengaplikasikan pembahasan kali ini, ada baiknya buat mengetahui terlebih dahulu manfaat yg mampu dihasilkan bagi pembaca maupun mesin pencari.
Kelebihan Menggunakan Script Box
- Memudahkan pembaca & mesin pencari dalam memahami konten tulisan
- Tulisan membuat jadi kian rapi
- Tulisan membuat jadi kian terstruktur.
- Setelah mengetahui pengertian & kelebihan yg mampu didapatkan, selanjutnya merupakan daftar tampilan lengkapnya.
- Pilihlah yg memang seperti bersama keinginan Anda agar tulisan membuat jadi kian menarik.
Script Box Keren Dasar
Tampilan 1
<div style="background-color: #f6f6f6; border: 1px solid #009ee0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 2
<div style="background-color: #f6f6f6; border: 1px solid #009ee0; border-radius: 0 10px 0 10px; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 3
<div style="background-color: #f6f6f6; border: 1px solid #009ee0; border-radius: 0 10px 10px 0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 4
<div style="background-color: #f6f6f6; border-left: 5px solid #009ee0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 5
<div style="background-color: #f6f6f6; border-top: 5px solid #009ee0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 6
<div style="background-color: #f6f6f6; border-top: 5px solid #009ee0; border-left: 5px solid #009ee0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 7
<div style="background-color: #f6f6f6; border-left: 5px solid #009ee0; border-radius: 10px; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 8
<div style="background-color: #f6f6f6; border: 5px solid #009ee0; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 9
<div style="background-color: #f6f6f6; border-radius: 10px; border: 5px outset #fafafc; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 10
<div style="background-color: #f6f6f6; border: 5px #009ee0 Double; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 11
<div style="background-color: #f6f6f6; border-left: 5px #009ee0 Double; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 12
<div style="background-color: #f6f6f6; border: 3px #009ee0 dotted; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Tampilan 13
<div style="background-color: #f6f6f6; border-left: 3px #009ee0 dotted; padding: 17px; text-align: left;">
Script di sini...
</div>
Script di sini...
</div>
Script Box Keren Variasi
Button
Post a Comment
Post a Comment