原文地址：http://www.cxybl.com/html/wyzz/CSS/20120601/27374.html
比如： .c1.c2 { text-decoration:underline; } 选择器中 .c1 与 .c2 直接连在一起，中间无空格、无逗号，表示什么意思？
看个例子：
head style type="text/css"
.c1 { color:#ff0000; }
.c2 { font-style:italic; }
.c1.c2 { text-decoration:underline; }
比如：
.c1.c2
{
text-decoration:underline;
}
选择器中 .c1 与 .c2 直接连在一起，中间无空格、无逗号，表示什么意思？看个例子：
<head>
<style type="text/css">
.c1
{
color:#ff0000;
}
.c2
{
font-style:italic;
}
.c1.c2
{
text-decoration:underline;
}
</style>
</head><body>
<p class="c1">这里是红色</p>
<p class="c2">这里是斜体</p>
<p class="c1 c2">这里是红色、斜体、下划线</p>
</body>结果已经通过文字直接描述出来了，原来 .c1.c2 表示如果一个标签中同时使用了这两个类（不论顺序、不论是否还有其他类），则响应此样式规则。
然而在 ie 中，第二个段落中除了有斜体还有下划线，说明它还把 .c1.c2 看作是 .c2。
于是，考虑到兼容性的原因，尽量不要使用 .c1.c2 这样的选择器。
.c1.c2
{
text-decoration:underline;
}
选择器中 .c1 与 .c2 直接连在一起，中间无空格、无逗号，表示什么意思？看个例子：
<head>
<style type="text/css">
.c1
{
color:#ff0000;
}
.c2
{
font-style:italic;
}
.c1.c2
{
text-decoration:underline;
}
</style>
</head><body>
<p class="c1">这里是红色</p>
<p class="c2">这里是斜体</p>
<p class="c1 c2">这里是红色、斜体、下划线</p>
</body>结果已经通过文字直接描述出来了，原来 .c1.c2 表示如果一个标签中同时使用了这两个类（不论顺序、不论是否还有其他类），则响应此样式规则。
然而在 ie 中，第二个段落中除了有斜体还有下划线，说明它还把 .c1.c2 看作是 .c2。
于是，考虑到兼容性的原因，尽量不要使用 .c1.c2 这样的选择器。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
