根据多个类别选择元素

我有一个样式规则,当它具备两个类时,我想将其应用于标签。 没有JavaScript,有什么方法能够执行此操做吗? 换一种说法: css

<li class='left ui-class-selector'>

我想申请只有在个人样式规则li有两个.left.ui-class-selector类应用。 浏览器


#1楼

你是说两堂课? “束缚”选择器(它们之间没有空格): ui

.class1.class2 {
    /* style here */
}

这将选择全部class1也具备class2元素。 spa

在您的状况下: code

li.left.ui-class-selector {

}

官方文档: CSS2类选择器ip


正如akamike指出的那样,Internet Explorer 6中此方法存在问题,您可能须要阅读如下内容: 在IE6 CSS中使用双 精度 类? 文档


#2楼

链选择器不只限于类,还能够对类和id都进行选择。 get

班级 io

.classA.classB {
/*style here*/
}

班级号 class

.classA#idB {
/*style here*/
}

Id和Id

#idA#idB {
/*style here*/
}

当前全部优秀的浏览器均支持此功能,但IE 6除外,它基于列表中的最后一个选择器进行选择。 所以,“。classA.classB”将仅基于“ .classB”进行选择。

对于你的状况

li.left.ui-class-selector {
/*style here*/
}

要么

.left.ui-class-selector {
/*style here*/
}

#3楼

您能够使用如下解决方案:

CSS规则适用于具备如下两个类别的全部标签:

.left.ui-class-selector {
    /*style here*/
}

CSS规则适用于全部具备<li>且具备如下两个类的标签:

li.left.ui-class-selector {
   /*style here*/
}

jQuery解决方案:

$("li.left.ui-class-selector").css("color", "red");

JavaScript解决方案:

document.querySelector("li.left.ui-class-selector").style.color = "red";
相关文章
相关标签/搜索