Question

我有以下CSS：

.navbar-inverse .nav > li > youtube-dialog > a {
    color: #999999;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px;
    display: block;
    text-decoration: none; /*underline*/

}

.navbar-inverse .nav > li > youtube-dialog > a:hover {color: #ffffff;}

然后我有：

.navbar-inverse .nav > li > video-server-dialog > a {
    color: #999999;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    padding: 10px 15px 10px;
    display: block;
    text-decoration: none; /*underline*/

}

.navbar-inverse .nav > li > video-server-dialog > a:hover {color: #ffffff;}

正如您所看到的，第二组样式中的所有内容都是元素的名称。

有没有办法在没有这么多重复的情况下写这个？

Answer 1

为a标记指定一个特定的类，并只声明您对该新类的CSS代码。像这样：

<强> HTML

<a href="#" class="dialog_a">test</a>

<强> CSS

.dialog_a { /* some code */ }

.dialog_a:hover { /* some other code */ }

有没有更好的方法来编写以下CSS？

1 个答案: