【CSS选择符】类型选择符

微信公众号：Rabbit_svip

CSS代码：

h1 {
    font-family: Arial, sans-serif;
    color: #CCF;
}

用于选取特定HTML标签的选择符，叫类型选择符或元素选择符。这种选择符的作用特别大。能把样式应用到网页中的每个目标标签上。使用这种选择符，只需少量工作就能大幅修改网页的外观。

假如想让网页中每个段落都使用相同的字体、颜色和字号，只需编写一个选择符为p（表示<p>标签）的样式即可。

HTML代码：

<p>
最基本的佐餐面包，便是吐司了。吐司的最大优点就是没有独特的味道，很容易搭配其他料理；例如，只是简单涂抹上一层黄油就很好吃；在两篇吐司里夹着火腿或蛋、蔬菜等食材做成三明治也很棒；在吐司上抹番茄酱，铺放奶酪后再烤，则是美味的吐司披萨。
</p>

<p>
吐司有“方形”和“山形”两种不同的形状，吃的时候最好配合吐司的特征，决定不一样的吃法。所谓吐司的特征，是指切片的厚度。不一样厚度的吐司会带来不一样的口感，从而衍生出许多吃法。切成薄片的吐司吃起来有松脆的口感，厚片吐司则有绵密松软的口感。请随着喜好选择适合的吐司，找到自己喜欢的吃法吧！
</p>

CSS代码：

p {
    font: normal 1.2em "Slabo 27px", Garamond, Times, serif;
    color: #0e98c6;
}

得到以下效果

微信公众号：Rabbit_svip

类型选择符用于重新定义浏览器显示所有标签的方式。
也就是对网页标签的重定义（reset）。

在CSS规则中很容易找到类型选择符，它们的名称与要装饰的标签名一样。例如p、h1、table、img等。

在CSS出现之前，如果要装饰文字，要把文字放在<font>标签里；如果想让网页中的每个段落都具相同的外观，通常要使用很多<font>标签。这样的过程是个体力活，要编写很多HTML代码，而且会导致网页的下载速度变慢，更新时要用很多时间。有了类型选择符，我们无需对HTML做任何修改，只需编辑所需的CSS规则，其他的工作都交给浏览器去做。

类型选择符的缺点：
◦无法精准控制每一个元素。
◦有可能加大浏览器的渲染压力（虽然对于现在的电脑来说几乎毫无压力）。

---

HTML与CSS 目录：HTML与CSS

下一篇：【CSS选择符】类选择符 和 ID选择符