Sekarang bagi yang belum mampu mengolah gambar/grafis dengan baik, jangan khawatir karena CSS 3 akan mengerjakannya dengan Sempurna.
Demo
Dengan menggunakan kode CSS seperti dibawah ini akan menghasilkan sebuah button emboss yang cantik tanpa harus menggunakan background images:
.button{Catatan:Cara ini belum didukung oleh Browser IE
margin: 0.1em;
text-align:center;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
width:140px;
padding:0.3em;
}
#b1 {
background:#ddd;
border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
border-radius: 25px;
-moz-border-radius: 25px;
-webkit-border-radius: 25px;}
#b1 a {
text-decoration:none;
color:#888;}
#b1 a:hover {
color:#555;}
No comments:
Post a Comment