Cara Membuat Kotak Script (Code Box) Pada Posting

Cara Membuat Kotak Script (Code Box) Pada Posting - Ayung Avis | Selamat pagi sobat Berbagi Info. Setelah posting informasi mengenai Cara Menulis Notulen Rapat Yang Baik, kali ini saya akan memberikan informasi tutorial mengenai cara membuat kotak script atau code box pada posting blog khususnya Blogger. Kotak kode script atau code box ini sangat bermanfaat bagi Anda yang sedang membuat artikel yang mana berisi banyak kode script yang harus ditampilkan.

Dalam membuat kotak kode script atau code box ini, Anda akan saya berikan beberapa contoh kotak kode script atau code box yang dibuat Apnie.com. Anda bisa memilih salah satu yang Anda suka dari contoh-contoh yang saya berikan.

Selain tinggal menggunakannya aja, Anda juga bisa memberikan beberapa perubahan dari contoh yang saya berikan supaya memiliki penampilan seperti yang Anda harapkan. Anda bisa mengubahnya seperti warna background, ukuran, jenis border, jenis font, dan lain-lain.

Contoh Kotak Kode Script (Code Box)

Dengan Border

<div style="border: 2px #5f200e solid; padding: 10px; background-color: #d9da81; text-align: left;"> Kode Script Anda Disini…….</div>

Tanpa Border

<div style="border: 0; padding: 10px; background-color: #82CAFA; text-align: left;"> Kode Script Anda Disini…….</div>

Inner Shadow

<div style="border: 2px #006400 inset; padding: 10px; background-color: #d5839f; text-align: left;"> Kode Script Anda Disini……</div>

Outer Shadow

<div style="border: 3px #5f200e  outset; padding: 10px; background-color: #d9da81; text-align: left;"> Kode Script Anda Disini…….</div>

Double Border

<div style="border: 3px #5f200e double; padding: 10px; background-color: #82CAFA; text-align: left;"> Kode Script Anda Disini…….</div>

Dotted Border

<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2; text-align: left;"> Kode Script Anda Disini……</div>

Dashes Border

<div style="border: 2px #610B38 dashed; padding: 10px; background-color:#57AA52; tex>t-align: left;"> Kode Script Anda Disini……</div>