Border-Image
Banyak hal yang menarik di sediakan oleh CSS3 dari segi border, misal kita dapat menerapkan sisi gradient, mengganti border dengan image, bahkan kita dapat membuat sudut round dengan tidak menggunakn gambar, hebat bukan? .
Buat file dengan nama border_img.html yang isinya seperti berikut:
<!DOCTYPE HTML>
<html>
<head>
<title> Border Effects </title>
<style>
h4 {
border-width: 27px;
-moz-border-image: url(border.gif) 27 repeat;
-webkit-border-image: url(border.gif) 27 repeat;
border-image: url(border.gif) 27 repeat;
</style>
</head>
<body>
<h4> Welcome to CSS3 </h4>
</body>
</html>
Nah setelah di coba-coba ternyata efek ini hanya berpengaruh pada web browser Google & Safari
hasilnya akan seperti gambar berikut:
2 comments
wah mastah bener nih pasti.. saya kagak ngarti tentang CSS gan :)
Thx mastah artikel nya sangat bermanfaat untuk newbie seperti saya
Peraturan :
1. Dilarang Menggunakan Link
2. Dilarang Membuat Kata-kata Sex, porn, Dsb
3. Komentar Yang Positif.
EmoticonEmoticon