Blogger
Code CSS Button Đẹp Cho Blogger
Hôm nay lục sục trên mạng kiếm code CSS "BUTTON" đẹp cho blogger. Ai ngờ ra đoạn code CSS này. Mình dùng thấy rất ok và khá đẹp nên viết bài share luôn cho anh em :D. Ai chưa có thì lấy về …
Hôm nay lục sục trên mạng kiếm code CSS "BUTTON" đẹp cho blogger. Ai ngờ ra đoạn code CSS này. Mình dùng thấy rất ok và khá đẹp nên viết bài share luôn cho anh em :D. Ai chưa có thì lấy về dùng thử nhé :D
/*Button Đẹp Cho Blogger By BomKhung.Info*/
#download_area {width:97%; margin:0px auto;text-align: center}
#download_area a, #download_area a:hover, #download_area a:visited{color:rgb(230, 230, 230); text-decoration:none; border-bottom:none;}
#download_area p {font-style:italic;font-size:12px;}
.button{display: inline-block;white-space: nowrap;background-color: rgb(109, 212, 37);background-image: none;border-width: 1px;border-style: solid;border-right: 1px solid rgba(255, 255, 255, 0.03);border-left: 1px solid rgba(255, 255, 255, 0.03);border-image: none;border-color: rgba(255, 255, 255, 0.04) rgba(255, 255, 255, 0.03) rgb(34, 34, 34);padding: 0 1.5em;margin: 0.5em;font: 1em/2em 'Coda', Cursive;text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.4);-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);text-transform:uppercase;-webkit-transition: all 0.1s linear 0s;-moz-transition: all 0.1s linear 0s;-o-transition: all 0.1s linear 0s;transition: all 0.1s linear 0s;}
.button:hover{background-color: rgb(45, 45, 45);-moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.7);-webkit-box-shadow: 0px px 4px rgba(0, 0, 0, 0.7);box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.7);}
.button:active{-moz-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;-webkit-box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;box-shadow: 0 0 4px 2px rgba(0,0,0,.3) inset;position: relative;top: 1px;}
.button:focus{outline: 0;background-color: rgba(255, 0, 0, 0.5);}
.button:before{background: #000;background: rgba(0,0,0,.1);float: left;width: 1em;text-align: center;font-size: 1.5em;margin: 0 1em 0 -1em;padding: 0 .2em;-moz-box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,0.03);-webkit-box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,0.03);box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,0.03);-moz-border-radius:.15em 0 0 .15em;-webkit-border-radius:.15em 0 0 .15em;border-radius:.15em 0 0 .15em;pointer-events: none;content: "\279C";color:rgb(200, 0, 0);}
Còn cách sữ dụng thì cũng không xa la gì nữa :D. Theo như bên dưới nhé mọi người :D
<div class='button'><a href=''>DEMO</a></div>
<div class='button'><a href=''>DOWNLOAD</a></div>
DEMO
Chúc các bạn thành công :D
Previous post
Code CSS Button Đẹp Cho Blogger
Related post
Hung.Pro.VN
Nhà thiết kế WebTôi là admin trang Hung.Pro.VN là một người có đam mê với Blogspot, kinh nghiệm 5 năm thiết kế ra hàng trăm mẫu Template blogpsot như" Bán hàng, bất động sản, landing page, tin tức...
Nhận xét
Đăng nhận xét