html – 如何为两个标签设置一个CSS规则？

发布时间：2020-12-14 21:46:56 所属栏目：资源来源：网络整理

导读：我想知道如何为两个不同的类设置一个设置。举一个例子： .footer #one .flag li .drop_down form div{ width: 80px; font-family: Arial,Helvetica,sans-serif; font-size: 11px; text-align: left; line-height: 1.5; color: #ccc; font-weight:bolder; ma

我想知道如何为两个不同的类设置一个设置。

举一个例子：

.footer #one .flag li .drop_down form div{
    width: 80px;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    text-align: left;
    line-height: 1.5;
    color: #ccc;
    font-weight:bolder;
    margin-left: 30px;
}
.footer #two .flag li .drop_down form div{
    width: 80px;
    font-family: Arial,sans-serif;
    font-size: 11px;
    text-align: left;
    line-height: 1.5;
    color: #ccc;
    font-weight:bolder;
    margin-left: 30px;
}

这两个规则都有相同的内容。区别只是第二个标签。有办法做这样的事吗？

.footer >>>#one and #two<<<< .flag li .drop_down form div{
        width: 80px;
        font-family: Arial,sans-serif;
        font-size: 11px;
        text-align: left;
        line-height: 1.5;
        color: #ccc;
        font-weight:bolder;
        margin-left: 30px;
    }

解决方法

用逗号分隔选择器：

.footer #one .flag li .drop_down form div,.footer #two .flag li .drop_down form div {
    /* Rules */
}

从selectors level 3 spec：

A comma-separated list of selectors represents the union of all elements selected by each of the individual selectors in the list. (A comma is U+002C.) For example,in CSS when several selectors share the same declarations,they may be grouped into a comma-separated list. White space may appear before and/or after the comma.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!