时间戳

首页 > 解决方案 > 当按钮处于活动状态并悬停时更改外观

css - 当按钮处于活动状态并悬停时更改外观

问题描述

我不明白以下要求以及如何实现它。

感谢所有付出努力的人。@Carlene 解决方案仅在我必须根据 requiremnet 进行修改时才有效

<button type="button" class="btn btn-default" id="submit-form">Submit Answer</button>

我尝试了以下，但它没有反映任何变化。

button#submit-form:hover {
    fill:#ffffff;
    outline: 1px;
    border-radius: 3px;
    box-shadow: 1px 1px 2px;
    font-family: Roboto;
    font-size: 14px;    
}

标签： css

解决方案

这是你想要的？

button#submit-form {
    background-color:#ffffff;
    border-radius: 3px;
    font-family: Roboto;
    font-size: 14px;  
    color: #697070;
}

button#submit-form:hover {
    box-shadow: 1px 1px 2px;
}

https://codepen.io/carlene_cannon_conner/pen/XWrxpmW

请注意，您要在悬停期间添加或覆盖的任何内容都应放在第二个块中。由于此 css 仅在悬停状态期间应用，否则它将使用您在 button#submit-form 中拥有的任何 css。

background-color 指的是按钮的背景颜色，color 指的是按钮中字体的颜色。

大纲是指边框吗？在这种情况下，您可能需要以下内容：

border: 1px solid black;

1px 是指边框的粗细，solid 是指边框的种类，例如 dotted 或 solid，black 是指您想要的颜色，也可以是十六进制值。

推荐阅读