HOME P H P C S S Tips and Trik Kontes SEO

Membuat Kotak Lengkung

Kadang tampilan web yang kita tampilkan di internet yang berupa kotak agak kurang menarik untuk dilihat. Sehingga banyak orang memodifikasi kotak dengan menumpulkan atau melengkungkan dikeempat sisinya. Ada beberapa cara untuk melakukan hal ini, bisa dengan cara menempelkan sebuah image, bisa juga dengan manipulasi via CSS. Kali ini kita akan membuat kotak lengkung di pojok segi empat dengan bantuan CSS.

Contoh script:

#lengkung {
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border: 2px ridge #FFFFFF; background-image:url(images/bgrx1.jpg); repeat-x bottom;  }

Keterangan :
  • Pada script diatas akan terlihat kotak lengkung sebesar 10 px, dengan border 2px dan model border ridge berwarna putih. Backgroundnya berupa images yang bernama bgrx1.jpg. Anda bisa mengganti image nya sesuai dengan image yang anda miliki, jika anda ingin backgroundnya berupa warna, maka anda cukup mengganti background-image:url(images/bgrx1.jpg); dengan background: #E7E8ED repeat-x bottom;
Anda juga bisa melihat artikel akmi lainya seperti setting buku dengan microsoft word 2007 atau drop down menu cantik dengan CSS dan PHP

1 comment:

  1. ok, thank, artikelnya.
    langsung ane pasang dan hasilnya siiip.

    ReplyDelete

Silakan Coment disini

Related Posts with Thumbnails

Artikel Lainnya


ARSIP BLOG
MY MENU
POSTING TERBARU
TUKAR LINK

MEMBER
WEB LINKs
VISITOR