bulat dengan CSS 3..
bagaimana cara menerapkanya di blog kita???
bagaimana cara menerapkanya di blog kita???
okeh,langsung aja saya kasih tw caranya…
but,saya selalu mengingatkan anda,selalu backup template anda
sebelum mencoba ^^
1.Copy paste css dibawah ini..
#rounded-box {
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-top-left-radius: 15px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 15px;
2.bila template anda,berdesain dengan border/kotak,maka akan lebih mudah membuatnya,tekan Ctrl+f…lalu cari kata moz
Contoh:
Contoh:
.post {
-moz-border-radius:6px;
-webkit-border-radius:6px;
background:$postbgcolor;
border:1px solid #C0C0C0;
margin:0 0 10px;
padding:10px;}
3.lalu ganti moz,dan webkit menjadi seperti ini:
.post {
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-top-left-radius: 15px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 15px;
background:$postbgcolor;
border:1px solid #C0C0C0;
margin:0 0 10px;
padding:10px;}
nah…yang templatenya ingin menggunakan border,dapat ditambahkan juga,di tiap posting,header,footer,sidebar,tabbar
contoh:
#main-wrapper {
width:470px;
background:#ffffff none repeat scroll 0 0;
border:1px solid #000000;
color:#000000;
display:inline;
float:right;
min-height:500px;
overflow:visible;
padding:5px 15px 15px;
position:relative;
min-height:500px; }
menjadi seperti ini
#main-wrapper {
width:470px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-top-left-radius: 15px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-webkit-border-bottom-right-radius: 15px;
background:#ffffff none repeat scroll 0 0;
border:1px solid #000000;
color:#000000;
display:inline;
float:right;
min-height:500px;
overflow:visible;
padding:5px 15px 15px;
position:relative;
min-height:500px; }

Comments
Post a Comment