CSS介绍（1）--选择器

CSS简介

层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

我们前几期已经介绍了常用的HTML5的标签，那么，我们也来介绍一下用CSS来修饰网页的方法。

选择器

什么是选择器呢？
每一条css样式定义由两部分组成，形式如下： [code] 选择器{样式} [/code] 在{}之间的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素

通用选择器

*{
	color：green;
	font-size：40px;
}

通用选择器使用时，在前面加上*即可，使用后文本中的所用标签都会被修饰。但是这种选择器用的不多。

类选择器

.word{color:green;font-size: 30px;}

<p>段落</p>
<p class="word">段落</p>

使用类选择器，需要定义一个类。首先写一个" . ",再写类的名字，之后定义样式就设置好了一个类。使用时，在标签中class属性中添加类的名字即可。只有添加类属性的标签有该属性。

元素选择器

p{color:red;font-size: 30px;}

 <p>段落</p>
    <ol>
        <li>第一</li>
    </ol>

元素选择器在使用前需要先声明想要修饰的元素（标签），只需要直接写该标签，再在大括号中定义即可。文本中所有该标签都会被修饰。

合并选择器

p,h3{color:red;font-size: 30px;}

<p>段落</p>
<h3>标题</h3>

当我们有很多标签想用同一种修饰方式时，一个一个用元素选择器会和麻烦，这是我们可以用合并选择器。在大括号前面写上所有我们想修饰的标签，并用的逗号隔开，其余的就和元素选择器相同了。

ID选择器

#text{color:red;font-size: 30px;}

<p id="text">段落</p>
<p>段落</p>

id选择器的使用和类选择器很想，首先我们要先定义一个ID地址，先写#，再写id名称，接着在大括号内定义属性即可，使用时在要修饰的元素的标签内定义id属性即可。只有定义id地址的元素被修饰，且一个id地址只能被使用一次。

选择器优先级

我们讲了那么多选择器，当他们同时使用时就需要考虑优先级，他们的优先级如下

    <p>选择器优先级</p>
    <p>全局选择器*</p>
    <p>元素选择器：标签名</p>
    <p>类选择器class(.)</p>
    <p>ID选择器:id地址</p>
    <p>合并选择器</p>
    <p>行内选择器>ID选择器>类选择器>元素选择器</p>

今天我们就先介绍到这里，有了选择器，我们就可以自由的进行修饰。那么我们就下期再见了！