如何更改CSS中“访问”按钮的背景色？
如何更改CSS中“访问”按钮的背景色？
提问于 2019-02-06 01:45:26
我试图改变按钮的背景色后，它已经被点击(并有可能使它，使您不能再次点击它)，但不知道如何改变颜色。为此，我只想使用HTML和CSS。我该怎么做？
body {
background-color: white;
}
.button {
font-family: "Arial", sans-serif;
background-color: black;
border: 10px dashed white;
color: white;
font-size: 30px;
text-align: center;
line-height: 0;
cursor:pointer;
border-radius: 8px;
height:200px;
width:400px;
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
}
.button:visited{
background-image:none;
background-color: red;
font-size: 35px;
border: 10px dashed black;
color: black;
}
.button:hover{
background-image:none;
background-color: white;
font-size: 35px;
border: 10px dashed black;
color: black;
}<button class="button" type="button" onclick="onClick()">Button</button>
Stack Overflow用户
发布于 2019-02-06 02:35:44
你可以做你想做的事，但不能用按钮标签。:visited选择器用于选择已访问的“链接”，因此它只在具有href字段的锚标记上工作。
来自w3schools：
由于安全问题，浏览器限制了可以为访问的链接设置的样式。 允许使用的样式如下： 颜色 背景颜色 边框颜色(不同边的边框颜色) 轮廓颜色 柱规则颜色 填充和笔画的颜色部分--所有其他样式--都是从一个:链接继承的。
body {
background-color: white;
}
.button {
font-family: "Arial", sans-serif;
background-color: black;
border: 10px dashed white;
color: white;
font-size: 30px;
text-align: center;
line-height: 0;
cursor:pointer;
border-radius: 8px;
height:200px;
width:400px;
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
}
.button:visited{
background-image:none;
background-color: red;
font-size: 35px;
border: 10px dashed black;
color: purple;
}
.button:hover{
background-image:none;
background-color: white;
font-size: 35px;
border: 10px dashed black;
color: blue;
}<a class="button" href="google.com" target="_blank">Button</a>
如果您的项目特别希望避免href，则必须使用javascript。如果您还希望在页面重新加载之后保持样式，那么您必须使用会话从后端执行此操作。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54545567
复制相关文章
相似问题
腾讯云开发者
