在css3中設置按鈕橫向漸變的方法:1.創建按鈕;2.設置按鈕寬高;3.使用background的-webkit-linear-gradient屬性設置橫向漸變;
在css3中設置按鈕橫向漸變的方法
1.首先,在頁面中創建一個按鈕;
<body><button type="button" class="colour">漸變按鈕</button>
</body>
2.按鈕創建好后,在css中設置按鈕的寬度和高度;
button{width:150px;
height:70px;
}
3.按鈕的寬高設置好后,使用background中的-webkit-linear-gradient屬性即可設置按鈕橫向漸變;
button {width: 150px;
height: 70px;
background:-webkit-linear-gradient(left,red,pink,#fff);
}
效果: