Senin, 18 Maret 2013

Membuat border pada artikel blog

Pada dasarnya fungsi border tidaklah berbeda dari text area. Sama-sama penting untuk penulisan kode script/html. Adakalanya kita ingin menampilkan sebuah kode script/html pada artikel terkait. Nah, kamu bisa memaksimalkan peran text area dan border pada artikel terkait. Ada beberapa jenis border yang akan saya jelaskan di sini:  

1) Copykan kode di bawah pada mode html
2) Ganti tulisan yang berwarna merah dengan kode script/html ataupun tulisan yang kamu inginkan
BORDER
digunakan untuk membatasi tulisan
<div style="border: 1px solid #FF7F00; margin: 10px 0px; padding: 10px; width: auto; height: auto; background-color: #6F00FF; text-align: center;">Tulisan yang akan ditampilkan disini</div>

Hasilnya seperti ini. Download scriptnya di sini
Tulisan yang akan ditampilkan disini

OVERFLOW
digunakan pada tulisan yang melebihi media yang tersedia. Overflow memiliki tiga perintah yaitu scroll, hide, dan auto.
Scroll: Jika tulisan melebihi media yang tersedia
Hide: Jika tulisan melebihi media dan sisanya akan disembunyikan
Auto: Mencakup scroll dan hide 
<div style="overflow:auto; border: 1px solid #FF7F00; margin: auto; padding: 3px; width: 95%; height: 100px; background-color: #6F00FF; text-align: center;">Tulisan yang akan ditampilkan disini</div>

Hasilnya seperti ini (Perintah auto). Download scriptnya di sini
Tulisan yang akan ditampilkan disini

Catatan:  Bagian yang berwarna biru adalah warna border sedangkan ungu adalah warna background. Kamu bisa menggantinya dengan warna yang kamu inginkan di sini. Selamat Mencoba.

0 komentar:

Posting Komentar