1 通配符(*) css2
兼容浏览器版本
| IE |
Firefox |
Chrome |
Safari |
Opera |
iOS Safari |
Android Browser |
Android Chrome |
| 7.0+ |
2.0+ |
4.0+ |
3.1+ |
3.5+ |
3.2+ |
2.1+ |
18.0+ |
注：
选定所有对象，需要考虑性能问题
示例
...
<head>
<style>
* {
color: red;
}
body .blue * {
color: blue;
}
</style>
</head>
<body>
<h1>颜色</h1>
<p>颜色</p>
<div class="blue">
<p>蓝色</p>
<p>蓝色</p>
<p>蓝色</p>
</div>
</body>
...
2 标签（类型）选择符(Element) css1
兼容浏览器版本
| IE |
Firefox |
Chrome |
Safari |
Opera |
iOS Safari |
Android Browser |
Android Chrome |
| 6.0+ |
2.0+ |
4.0+ |
3.1+ |
3.5+ |
3.2+ |
2.1+ |
18.0+ |
示例
...
<head>
<style>
h1 {
color: red;
}
p {
color: blue;
}
</style>
</head>
<body>
<h1>颜色</h1>
<p>颜色</p>
</body>
...
3 ID选择符(Element#id) css1
兼容浏览器版本
| IE |
Firefox |
Chrome |
Safari |
Opera |
iOS Safari |
Android Browser |
Android Chrome |
| 6.0+ |
2.0+ |
4.0+ |
3.1+ |
3.5+ |
3.2+ |
2.1+ |
18.0+ |
注：
唯一标识
示例
...
<head>
<style>
#title {
color: red;
}
#color {
color: blue;
}
</style>
</head>
<body>
<h1 id="title">颜色</h1>
<p id="color">颜色</p>
</body>
...
4 类选择符(Element.class) css1
兼容浏览器版本
| IE |
Firefox |
Chrome |
Safari |
Opera |
iOS Safari |
Android Browser |
Android Chrome |
| 7.0+ |
2.0+ |
4.0+ |
3.1+ |
3.5+ |
3.2+ |
2.1+ |
18.0+ |
示例
...
<head>
<style>
.title {
color: red;
}
.color {
color: blue;
}
.color.gray {
color: gray;
}
</style>
</head>
<body>
<h1 class="title">颜色</h1>
<p class="color">颜色</p>
<p class="color gray">颜色</p>
</body>
...
网友评论