通配选择符(*)
选定所有对象
- 通配选择符(Universal Selector)
- 通常不建议使用通配选择符,因为它会遍历并命中文档中所有的元素,出于性能考虑,需酌情使用
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
color: #FF0000;
font-weight: bold;
}
</style>
</head>
<body>
<div>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ul>
<li>Java</li>
<li>C#</li>
</ul>
</div>
</body>
</html>
类型选择符(Element)
以文档语言对象类型作为选择符
- 类型选择符(Type Selector)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p{
color: #FF0000;
font-weight: bold;
}
</style>
</head>
<body>
<div>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ul>
<li>Java</li>
<li>C#</li>
</ul>
</div>
</body>
</html>
ID选择符(Element#ID)
以唯一标识符id属性等于myid的E对象作为选择符
- ID选择符(ID Selector)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#language{
color: #FF0000;
font-weight: bold;
}
</style>
</head>
<body>
<div>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ul id="language">
<li>Java</li>
<li>C#</li>
</ul>
</div>
</body>
</html>
类选择符(Element.class)
以class属性包含myclass的E对象作为选择符
- 类选择符(Class Selector)
- 不同于ID选择符的唯一性,类选择符可以同时定义多个
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.a{
color: #0000FF;
}
.b{
font-weight:bold;
font-size: x-large;
}
</style>
</head>
<body>
<div>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ul class="a b">
<li>Java</li>
<li>C#</li>
</ul>
</div>
</body>
</html>