Jangan Mau Tersudut
Ada kaLanya kita membutuhkan sudut untuk mempertegas suatu bentuk, tapi ada kaLanya puLa kita ingin menghiLangkan sudut untuk memberi kesan haLus, ramah dan fLeksibeL. Bagaimana cara menyiasati tampiLan html supaya tak meLulu kotak? CSS bisa membuat sudut-sudut daLam html akan tampak meLengkung (rounded corner), sahabat hanya perLu menambahkan beberapa style ke daLam kode html. Berikut contoh kode CSS nya:
Melengkung pada semua sudut
<div style="border:1px solid #000000; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;">Contoh teks</div>Melengkung pada sudut kiri atas
<div style="border:1px solid #000000; border-top-left-radius:10px; -moz-border-radius-topleft:10px; -webkit-border-top-left-radius:10px;">Contoh teks</div>Melengkung pada sudut kanan atas
<div style="border:1px solid #000000; border-top-right-radius:10px; -moz-border-radius-topright:10px; -webkit-border-top-right-radius:10px;">Contoh teks</div>Melengkung pada sudut kiri bawah
<div style="border:1px solid #000000; border-bottom-left-radius:10px; -moz-border-radius-bottomleft:10px; -webkit-border-bottom-left-radius:10px;">Contoh teks</div>Melengkung pada sudut kanan bawah
<div style="border:1px solid #000000; border-bottom-right-radius:10px; -moz-border-radius-bottomright:10px; -webkit-border-bottom-right-radius:10px;">Contoh teks</div>dimana angka 10px adaLah besar jari-jari lengkungan.
Tested On : Firefox 3.6.3, Chrome 4.1, Safari 3.2.3, Opera 10.53, Flock 2.5.6
pertamax dulu ah … ;))
wah … seandainya saya bisa menerapkannya … nanti dech kalau punya domain pribadi … tak bookmark dulu ah … ^:)^
Siippp, makasih pelajaran htmlnya pagi ini Hari.
‘met malming yaa.. salam buat Dy
Thankyouuu mas hariiii
Selamat pagii menjelang siang
.-= jumialely´s last blog : Mengintip Gaya dan Pose mu =-.
Waaa, terima kasih om Harry ilmunya, bisa dipraktekkkan di mana saja kan??
hmm , sering-sering aja posting seperti ini. biar kita tambah jago , kode htmlnya
Ilmu tidak hanya bisa kita dapatkan di sekolah saja. tapi dimana2…
dulu saya nyari yang beginian nih 😉 makasi mas
.-= Afif Logicprobe10´s last blog : Mengenal PLC =-.
Makin rapi makin rapi…
Pemilihan fontnya makin diperhatikan…
Belajar tak pernah henti!!
Tak biji 8
.-= marsudiyanto´s last blog : Kalau SMK Bisa, SMA Bagaimana? =-.
Langsung tak terapke ning rambu2 jalan…
.-= marsudiyanto´s last blog : Kalau SMK Bisa, SMA Bagaimana? =-.