Cara Membuat Kotak Code Script di Postingan Blog

Cara Membuat Kotak Code Script di Postingan Blog

Hi sobat blogger, buat kalian yang sedang mencari cara menampilkan kotak script html di postingan blog, berikut saya bagikan, beberapa jenis dan model kota script yang bisa kalian pilih. Sebelum kita lanjut ke bagian tutorial, mari kita simak dulu manfaat menggunakan kotak untuk kode script pada postingan, terutama kalian para blogger atau conten writer yang menulis contet tentang tips edit html atau css. 

tutorial menampilkan kotak script yang saya bagikan ini, sangat simple, kalian tidak perlu mengubah css pada edit html blog. Kalian hanya tinggal mencopi script kota tersebut di bagian HTML pada postinga. 

Mengapa harus pakai kotak saat ingin menampilkan code script pada postingan?

1. Memudahkan penulis untuk menampilkan code script yang dinginkan

2. Tampilan lebih rapi dan simple

3. Lebih menarik, karena memiliki banyak model dengan warna yang bisa disesuaikan sendiri

Selanjutnya mari kita simak beberapa jenis kotak script yang bisa kalian gunakan.

Gaya Border di Kiri

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #d3d3d3; border-left: 5px solid #FF3300; border-radius: 10px; padding: 10px; t-align: left;">Pasang Code Script di Sini</div>

Gaya Minimalis

<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;">Pastekan kode script disini</div>

Gaya Dotted

<div style="background-color: #d580fe; border: 2px #1b1a76 dotted; padding: 10px; text-align: left;">Pastekan kode script disini</div>

Gaya Border Double

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #6fa8dc; border-radius: 10px; border: 4px double #fff; padding: 10px; t-align: left;">Pastekan kode script disini</div>

Gaya Dotted Orange

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ffe599; border-radius: 10px; border: 2px dashed
#aaa; padding: 10px; t-align: left;">Pastekan kode script disini</div>

Gaya Scrol

<div style="background-color: #82cafa; border: 2px #006400 solid; height: 50px; overflow: auto; padding: 10px; text-align: left; width: 300px;">Pasang kode  script disini</div>

Itulah tutorial cara membuat kota untuk code postingan di blog. Cara tersebut sangat simple, kalian tinggal copy saja Script tersebut di bagian HTML postingan post mu.

Lihat berikut:

Catatan: Warna-warna pada kota code script tersebut bisa kalian ubah dan sesuaikan dengan selera atau warna favoritemu, caranya, kamu tinggal ganti saja kode warna (#.....) dengan kode warna yang kalian inginkan. 

Demikian tutorial dari kami, jika kalian merasa artikel ini cukup membantu. Jangan lupa like, coment dan share artikel ini ya. Terimakasih :)

Automabar

Hello! We are AutoMabar Team. we're ready to share all about tutorial what you need. Especially about Blogging, Game and Application

Share this post