Ada beberapa sobat blogger yang mungkin belum tahu cara membuat bingkai (kotak) pada tulisan. Atau mungkin ada yang sudah tahu tapi tidak tahu bagaimana membuat tulisan dalam bentuk script HTML di dalam kotak tersebut. Atau mungkin juga sudah tahu tapi belum mengerti benar akan perintah-perintah yang ada karena hampir di setiap artikel mengenai bingkai ini tidak diberikan penjelasan yang memadai sehingga cukup menyulitkan bagi blogger pemula untuk memahaminya. Nah, mungkin tulisan ini akan berguna untuk mengatasi “ketidaktahuan” tersebut.
Ada tiga jenis kotak yang biasa dipakai untuk membingkai sebuah tulisan, yaitu: border, overflow (biasanya disebut kotak scroll), dan textarea. Tentu saja ketiganya memiliki karakteristik yang berbeda. Nah, untuk mengetahui itu semua, berikut akan dijelaskan satu persatu mengenai bingkai tersebut.

Border
Seperti namanya, border berarti bingkai yang membatasi tulisan/gambar yang berada di dalamnya. Dan untuk membuatnya tinggal mengkopi script berikut:

<div style="border: 1px solid #CCC; margin: 10px 0px; padding: 10px; width: auto; height: auto; background-color:#FBFBEE; text-align: left;">isi tulisan disini</div>
 
Keterangan:

  • Border: 1px solid #CCC, berarti ketebalan garis (border) adalah 1px dengan warna abu-abu (mengenai kode warna dapat dilihat di Adobe Photoshop atau CorelDraw. Atau bisa kamu kunjung situs HTML Color Codes).
  • Margin: 10px 0px, berarti margin atas-bawah 10 px dan margin kiri-kanan 0 px.
  • Padding: 10px, berarti jarak tulisan ke border adalah 10px.
  • Perintah auto pada width dan height supaya lebarnya mengikuti lebar kolom yang tersedia, sedangkan tingginya mengikuti isi (tulisan/gambar) yang dimasukkan kedalamnya. Kamu bisa merubah perintah auto kedalam bentuk pixel, misalnya: 100px.
  • Background-color:#FBFBEE, berarti kotak berwarna gading. Jika ingin dihilangkan warnanya, ganti kode #FBFBEE dengan none atau hapus perintah background-color berikut kode warnanya.
  • Text-align: left, berarti tulisan dalam bentuk rata kiri. Jika kamu ingin mengubahnya, ganti saja left-nya dengan right, center, atau justify (rata kanan = right, rata tengah = center, dan rata kiri-kanan = justify).

1 Comments:

software download serial mengatakan...

thanks boz untuk tutorialnya

Posting Komentar

Copyright © 2012 →∞¨ηня¨cσσļ¨sιτз¨∞← / Template by : Urangkurai