Warning: curl_init() has been disabled for security reasons in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 95

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 97

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 98

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 100

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 103

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 106

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 333

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 334

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 363

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 370

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 375

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 376

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 377

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 379

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 382

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 150

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 151

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 159

Warning: curl_exec() has been disabled for security reasons in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 162

Warning: curl_errno() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 167

Warning: curl_errno() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 167

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 181

Warning: curl_setopt() expects parameter 1 to be resource, null given in /home/gusdiinf/public_html/wp-includes/Requests/Transport/cURL.php on line 182
Membuat Button Emboss dengan CSS 3 | Gusdwi.info

Membuat Button Emboss dengan CSS 3

css 3 button embossSebelum kelahiran Css 3, biasanya para web developer atau web designer akan membuat button emboss dengan tehnik grafis (background images) yang dibuat di photoshop ataupun program pengolah gambar lainnya.

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{
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;}

Catatan:Cara ini belum didukung oleh Browser IE
Example

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *