[TIPS BLOG] Cara Membuat Box Warna Warni Pada Postingan Blog

Membuat Textbox Pada Blog

Untuk membuat box script atau kotak pada postingan blog, anda memerlukan bantuan beberapa properti yang dimiliki oleh CSS, antara lain width, height, dan background. Width digunakan untuk mengatur lebar dari sebuah kotak, dengan value angka dengan satuan px. Sedangkan untuk height digunakan untuk mengatur tinggi dari sebuah box dengan satuan px. Dan background digunakan untuk mengatur warna dari sebuah box.

Box pada suatu halaman postingan blog memiliki kegunaan agar tampilan blog terlihat rapi dan mudah dipahami. Tampilan box juga bermacam macam ada yang hanya berbentuk kotak ada juga yang ditambah dengan scroll, bisa juga diganti backgroundnya dan ditambahkan dengan border.

Caranya tidak begitu sulit tinggal copas script yang ada dibawah dan akan muncul tampilan kotak pada postingan kita, ikuti langkah langkah berikut :

1. Pilih Box Yang Diinginkan
Gambar 1. Pilih Box Yang Diinginkan

2. Pastekan ke entri pada menu tab HTML
Gambar 2. Pilih Mode HTML

3. Pilih mode compose dan pastekan code script didalamnya
Gambar 3. Pilih Mode Compose


Dengan begitu, maka box kreatif dan warna warni telah berhasil dibuat pada postingan blog anda. berikut ini pilihan-pilihan box yang bisa anda pilih.

<div style="-moz-border-radius: 20px; -webkit-border-radius: 20px; background-color: #00b8ff; border-radius: 10px; border: 7px outset rgb(255, 255, 255); padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="background-color: #d5839f; border: 2px inset rgb(0, 100, 0); padding: 10px; text-align: left;">Pastekan Code Script Di Sini !</div>



<div style="background-color: #82cafa; border: 3px double rgb(95, 32, 14); padding: 10px; text-align: left;">Pastekan Code Script Di Sini !</div>



<div style="background-color: #c2c2c2; border: 2px dotted rgb(27, 26, 118); padding: 10px; text-align: left;">Pastekan Code Script Di Sini !</div>



<div style="background-color: #36e4fd; border: 2px dashed rgb(97, 11, 56); padding: 10px;">Pastekan Code Script Di Sini !</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #a2c4c9; border-radius: 10px; border: 4px outset rgb(255, 255, 255); padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #6fa8dc; border-radius: 10px; border: 4px double rgb(255, 255, 255); padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ffe599; border-radius: 10px; border: 2px dashed rgb(170, 170, 170); padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-radius: 10px; border: 4px solid rgb(153, 153, 153); padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid rgb(34, 136, 221); border-radius: 10px; padding: 10px; t-align: left;">Pastekan Code Script Di Sini !</div>



<div style="background-color: #eaeaea; border: 1px solid rgb(68, 68, 68); padding: 10px; text-align: left;">Pastekan Code Script Di Sini 11</div>



<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid rgb(34, 136, 221); border-radius: 10px; height: 100px; overflow: auto; padding: 10px; width: 600px;">Pastekan Code Script Di Sini 11</div>


Lokasi: Penglatan, Kec. Buleleng, Kabupaten Buleleng, Bali, Indonesia

Komentar

Posting Komentar

Popular Posts

Jenis-Jenis Port beserta Penjelasan, Gambar, dan Fungsinya Pada Console Unit

Gambar
Satu unit komputer terdiri dari CPU, Monitor, Keyboard dan Mouse. Pada CPU yang merupakan sistem unit atau console memiliki beberapa port. Port pada komputer berfungsi sebagai antarmuka antara sebuah komputer dengan komputer atau dengan unit (device) lain. Umumnya, port digunakan untuk menghubungkan monitor, keyboard, mouse, modem dan periferal lainnya. Port memiliki standar bentuk sendiri, seperti port untuk keyboard berbentuk bulat. Pertama kali komputer desktop diciptakan, memiliki dua port yaitu port serial dan port parallel. Pemasangan kabel monitor, keyboard dan mouse harus sesuai dengan portnya. Kesalahan pemasangan dapat menyebabkan tidak berfungsinya komputer. Untuk dapat memasang port sesuai dengan posisinya, berikut ini terdapat beberapa port console. Port adalah mekanisme yang mengizinkan sebuah komputer untuk mendukung beberapa sesi koneksi dengan komputer lainnya dan program di dalam jaringan. Port dapat mengidentifikasikan aplikasi dan layanan yang menggunakan k
Baca selengkapnya

Proposal Usaha Bengkel Las Dan Bubut “Sabadha Logam”

Gambar
BAB I PENDAHULUAN Eratnya persaingan kerja sekarang ini yang disebabkan karena keadaan ekonomi di Indonesia yang memprihatinkan sejak krisis ekonomi yang melanda bangsa Indonesia membuat banyak masyarakat yang kehilangan pekerjaan dan pengangguran. Banyaknya para pengusaha yang bangkrut kemudian gulung tikar. Banyak para remaja yang putus sekolah dan menjadi pengangguran. Sebagai Warga Negara kreatif kita tidak boleh putus asa ataupun pantang menyerah pada keadaan sekarang ini yang serba sulit kita harus berusaha, kreatif, inovatif dan berani mengambil suatu keputusan serta resiko untuk menciptakan lapangan pekerjaan sendiri.kita tidak harus bergantung pada orang lain. Untuk mendapatkan suatu pekerjaan kita harus berusaha semaksimal mungkin. Salah satu usaha yang dilakukan untuk mengurangi pengangguran yaitu dengan berwirausaha. Dengan kita berwirausaha kita bisa belajar mandiri dan bisa memaknai arti penting kehidupan secara tidak langsung kita sudah membantu banyak orang
Baca selengkapnya

Drama : Liburan Ke Kebun Binatang

          Saat libur sekolah Antika dan karolina merencanakan pergi ke kebun binatang bersama. Mereka berdua merupakan teman satu kelas yang selalu bersama.           Pagi yang sangat cerah, Antika sedang asyik menyiram tanaman dikebun sekolah. Tiba – tiba, ada seseorang yang berteriak dan datang menghampiri. karolina : “(Datang mengampiri antika yang sedang bermain). tik, aku punya kabar nih.” Antika : “Kabar apaan na?, Pasti mau ngajak aku   jalan – jalan deh.” karolina : “Kok tau?” Antika : “Aku asal nebak aja kok.” karolina: “Tapi tebakan kamu bener, An. Jadi aku bakal ngajakin kamu jalan – jalan.” Antika : “Emang mau jalan – jalan kemana sih na?” Karolina: “Kali ini aku mau ngajak kamu jalan – jalan ke kebun binatang. Ya, mungkin kedengarannya biasa dan nggak seru. Tapi kali ini aku jamin seru deh. Soalnya kita bisa melihat banyak hewan-hewan disana.” Antika : “Wah, mau banget dong. Aku kan belum pernah ke kebun binatang. Liburannya kapan?” Karolina : “Hari M
Baca selengkapnya