css - 如何按照提供的规范编写 css 类？

Question

您好，我正在尝试按照给定的规范编写 css 类。例如，如果我正在设计一个按钮，他们会给出如下规范。 正常:-

悬停:-

下面是我显示按钮的 html 代码。

<input type="button" class="btn" value="Button"/>

我想按照提供的规范为上述按钮编写类。我可以知道这个怎么写吗？我已经尝试了下面的内容，但如果我错了，请纠正我。

 .btn {
            background: rgb(12,116,218);
            border: rgb(12,116,218);
            border-bottom: rgb(0,76,151);
        }

另外，如何根据上述规范为悬停编写 css？任何帮助，将不胜感激。谢谢

Answer 1

使用 :hover 选择器创建另一个规则

.btn {
    background: rgb(12,116,218);
    border: rgb(12,116,218);
    border-bottom: rgb(0,76,151);
}
.btn:hover {
    background: rgb(46,146,250);
}

<input type="button" class="btn" value="Button"/>