之前為大家分享了推薦10款純css3實現的實用按鈕,今天給大家帶來一款純css3實現的顏色漸變按鈕。這款按鈕的邊框和文字的顏色通過css3實現兩種顏色的漸變,效果非常好看,一起看下效果圖:
實現的**。
html**:
<css3**:div
class
="container"
>
<
a target
="_blank"
class
="btn green"
href
=""><
span
>nominate yourself
span
>
a>
<
a target
="_blank"
class
="btn orange"
href
=""><
span
>nominate someone
span
>
a>
<
a target
="_blank"
class
="btn blue"
href
=""><
span
>buy tickets now
span
>
a>
div>
.btn.btn.green
.btn.green span
.btn.orange
.btn.orange span
.btn.blue
.btn.blue span
.btn:nth-of-type(1)
.btn:nth-of-type(2)
.btn:nth-of-type(3)
*body
.container
.container:after
ah1.method1
一款純css3實現的動畫按鈕
今天給大家分享一款純css3實現的動畫按鈕。第一排的按鈕當滑鼠經過的背景色動畫切換,圖示從右側飛入,第二排的按鈕當滑鼠經過的時候邊框動畫切換,圖示右側飛入,效果非常好,一起看下效果圖 實現的 html div class black a href class btn span become a me...
一款純css3實現的翻轉按鈕
之前為大家介紹了好多純css3實現的很漂亮的按鈕。今天小編要給各再分享一款純css3實現的翻轉按鈕。實現中給出了兩種的翻轉特效,一種是基於按扭的左邊緣為中心線,另一種是基於按鈕的中間為中心線。我們一起看下效果圖 實現的 html article a target blank class btn fo...
一款純css3實現的動畫載入導航
之前為大家介紹了好幾款導航選單,今天為給大家再帶來一款純css3實現的動畫載入導航。該導航出現的時候以動畫的形式出現。效果圖如下 實現的 html ul class main menu li class main menu item active a href home a li li class ...
一款純css3實現的條紋載入條
之前為大家帶來了很多載入動畫。基於prefixfree.js的進度載入條 基於jquery帶百分比的響應式進度載入條。今天給大家分享一款純css3實現的條紋載入條。帶有響應式的效果。效果圖如下 實現的 html div class container div class warning div di...
一款純css3實現的動畫載入導航
之前為大家介紹了好幾款導航選單,今天為給大家再帶來一款純css3實現的動畫載入導航。該導航出現的時候以動畫的形式出現。效果圖如下 實現的 html ul class main menu li class main menu item active a href home a li li class ...