css四种基本选择器

css选择器是什么?

要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。

HTML页面中的元素就是通过CSS选择器进行控制的。

CSS选择器:就是指定CSS要作用的标签,那个标签的名称就是选择器。意为:选择哪个容器。

CSS的选择器分为两大类:基本选择题和扩展选择器。

基本选择器:

1.标签选择器:针对一类标签

2.ID选择器:针对某一个特定的标签使用

3.类选择器:针对你想要的所有标签使用

4.通用选择器(通配符):针对所有的标签都适用(不建议使用)

1.标签选择器:一个完整的HTML页面是有很多不同的标签组成,而标签选择器,则是决定哪些标签采用相应的CSS样式,(在大环境中你可能出于不同的位置,但是不管怎么样,你总是穿着同一套衣服,这件衣服就是由标签选择器事先给你限定好的,不管走到哪里都是这身衣服)

如下所示:

style type="text/css">

p{

font-size:40px;

}</style>

<body>

<p>标签选择器</p>

</body>

2.id选择器:根据元素ID来选择元素,具有唯一性。前面以”#”号来标志。

<head>

<title>Document</title>

<style type="text/css">

#good

{

border:3px dashed green;

}

</style>

</head>

<body>

<h2 >id选择器</h2>

</body>

3.类别选择器:类选择器根据类名来选择。和id非常相似,任何的标签都可以携带id属性和class属性。但是id属性只能被某一特定标签引用一次。

如下所示:

<style type="text/css">

.xl{

color: green;

}

.xd{

font-size: 40px;

}

</style>

<p class="xl xd">段落</p>

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

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

4.通配符*:匹配所有标签不建议使用。

<style type="text/css">

/*定义通用选择器*,希望所有标签的颜色是绿色字符大小40磅*/{

color: green;

font-size: 40px;

}

</style>