<分区>
<分区>
我正在尝试将 CSS 渐变应用于我的 <a>
元素。它显然不起作用,我一直在尝试解决它但没有成功。如果必须对问题采取任何措施,我会使用 Chrome。
body {
margin: 1cm;
}
a {
padding: 15px 60px 15px 60px;
text-decoration: none;
border: 1px solid black;
}
#1button {
background: rgb(2, 0, 36);
background: linear-gradient(65deg, rgba(2, 0, 36, 1) 0%, rgba(12, 12, 125, 1) 35%, rgba(0, 212, 255, 1) 100%);
}
#2button {
background: rgb(2, 0, 36);
background: linear-gradient(65deg, rgba(2, 0, 36, 1) 0%, rgba(232, 51, 55, 1) 35%, rgba(241, 95, 223, 1) 100%);
}
<a id="1button">Button #1</a>
<a id="2button">Button #2</a>
最佳答案
不要使用数字作为您 ID 的第一个字符:
body {
margin: 1cm;
}
a {
padding: 15px 60px 15px 60px;
text-decoration: none;
border: 1px solid black;
}
#button1 {
background: linear-gradient(65deg, rgba(2, 0, 36, 1) 0%, rgba(12, 12, 125, 1) 35%, rgba(0, 212, 255, 1) 100%);
}
#button2 {
background: linear-gradient(65deg, rgba(2, 0, 36, 1) 0%, rgba(232, 51, 55, 1) 35%, rgba(241, 95, 223, 1) 100%);
}
<a id="button1">Button #1</a>
<a id="button2">Button #2</a>
关于html - 线性渐变不适用于 <a> 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52444776/