JNet99

Enjoy Saja Bro

Membuat Box tulisan

Sbola_p2ering kita lihat beberapa blog atau website tertentu mempunyai suatu box ( kotak ), biasanya warnanya abu-abu terkadang ada juga ada warna lainnya. Dan box ini sering saya namakan Grey Box. Biasanya Box ini berisi tulisan atau text yang biasanya untuk menekankan sesuatu yang penting atau perlu diperhatikan, jadi dengan membuat suatu kotak pada tulisan, paragraf tersebut akan kelihatan menarik.

Tentu kita pernah lihat tampilan kotak seperti ini,
mungkin dengan berbagai macam gaya yang pernah kita temukan

Dimenu blog ini kita tentu tidak menemukan fasilitas bagaimana caranya membuat Box tersebut, karena untuk membuatnya kita harus menggunakan bahasa HTML/ PHP. Dan setiap blog tentunya harus mengenal bahasa HTML/ PHP ini, dengan mengaktifkan menu HTML/ PHP kita bisa berkreasi untuk memperindah tampilan tulisan kita. Perintah dasanya untuk itu adalah sebagai berikut :

<pre style="overflow: auto; width: 500px;
height: 50px;text-align: left; border: 6px outset;
font-size: 14px;background-color: #cccccc;
border-color: #CCCCCC;padding: 2px; margin: auto;
"><strong>Tulisan Anda Ada disini</strong>
</pre>

Kita bisa langsung dapat mencoba perintah diatas, dan yang harus diingat saat menulis perintah diatas posisi tab harus dalam posisi HTML, untuk melihat hasil nya kita bisa lihat dalam tab visual,  dalam tab visual ini kita bisa melanjutkan menulis seperti biasanya.

Maksud dari perintah diatas sbb :

<pre>……….</pre> : persiapan.

Style = “……………..” : style atau gaya.

“overflow : auto”      : apabila tulisan kita melewati garis yang kita batasi maka akan terbentuk Scroll secara                                       otomatis.

“width=500px”        : lebar kotak 500 pixels.        

“height=50px”         : tinggi kotak 50px.

“text-align : left”     : tulisan rata kiri.

“border : 6px outset” : garis kotak lebarnya 6 Piksel, dan kelihatan timbul, option lainnya “inset”.

“font-size : 14px”     : ukuran font;

“Background-color : #cccccc”   : warna background abu-abu.

 “border-color : #cccccc” : warna garis kotak abu-abu.

“padding : 2px”        : posisi tulisan dari batas atas.

“margin : auto”         : posisi kotak ditengah.

<strong>…….</strong> : tulisan huruf tebal.  

Saya kira cukup  penjelasan saya mudah-mudahan pembaca bisa memanfaatkannya.

Artikel terkait

Filed under: html, Komputer, Tips & Tricks, , , , , ,

9 Responses

  1. fredricbernard mengatakan:

    wach makasih mas atas infonya senang infoonya kl berhasil jadi semangat..heheeh

  2. arali2008 mengatakan:

    karena dibuku tamu tidak terlihat “leave Comment”
    jadi comment kunjungan balasan disini saja
    trims bisa jadi bahan rujukan untuk mempercantik blogku

    jawab : trimakasih kembali atas pemberitahuannya, sekarang sudah saya aktifkan

  3. kelana mengatakan:

    TQ bos….Mantap>>>ntar dicoba dolo nich TQ sblumnya

  4. Abdul Muiz mengatakan:

    Terimakasih om tulisannya, sangat bermanfaat. salam kenal

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

delicious

%d blogger menyukai ini: