Saturday, March 19, 2016

Property Border

BAB 4

Border-Round
Biasanya ketika kita hendak membuat sesuatu sudut menjadi bundar (round), maka mau tidak mau kita harus menggunakan bantuan file gambar. Namun tidak demikian bila kita menggunakan CSS3. semuannya bisa dilakukan dengan CSS3 tanpa bantuan gambar apapun, berikut scripnya :

<!DOCTYPE HTML>
<html>
<head>
<title> Border Effects </title>
<style>
h4 {
background:#FFF;
border:1px solid #000;
width:500px;
text-align:center;
height: 100px;
-webkit-box-shadow: 10px 10px 5px #888;
-moz-box-shadow: 10px 10px 5px #888;
-moz-border-radius:15px 0px 15px 0px;
-webkit-border-radius:15px;
padding: 5px 5px 5px 5px;
</style>
</head>
<body>

<h4> Welcome to CSS3 </h4>

</body>
</html>

Save dengan nama border-round.html
Efek Ini dapat bekerja atau berjalan pada web browser Mozilla, Google Crome, dan Safari
Berikut Tampilan nya :
Selanjutnya saya akan membahas BAB 4- Border-Shadow , Kunjungi terus sidary

5 comments

sekrang tau gan, carannya bikin properti border,,, langsung praktekin aja,,, makasih gan,,,,, keep posting,,,,

biasanya ane kalau make border yang lebih simple seperti ini border: solid 4px;

Saya tunggu bab bab selanjutnya gan

Peraturan :
1. Dilarang Menggunakan Link
2. Dilarang Membuat Kata-kata Sex, porn, Dsb
3. Komentar Yang Positif.

EmoticonEmoticon