CSS-基础选择器

选择器的作用

选择器是根据不同需求把不同标签选出来

最常见的 CSS 选择器是元素选择器

标签选择器

标签选择器是指用 HTML 标签名称作为选择器, 按标签名称分类, 为页面中某一类标签指定统一的 CSS 样式

/* 语法: */
标签名 {
  属性1: 属性值1;
  属性2: 属性值2;
  属性3: 属性值3;
}

/* 例子 */
html {
  color: black;
}
h1 {
  color: blue;
}
p {
  color: silver;
}

类选择器

类选择器使用 . 进行标识, 后面紧跟类名
类名可以使用 - 短横线进行连接
类选择器可以单独选择一个或几个标签
一个元素可以有多个类名, 使用空格分隔

语法:

<div class="red font35"></div>

/* 语法 */
.类名 {
  属性1: 属性值1;
}
/* 例子 */
.red {
  color: red;
}
/* 多类名 */
.font35 {
  font-size: 35px;
}

id 选择器

ID 选择器允许以一种独立于文档元素的方式来指定样式。

注意:

• 只能在文档中使用一次: 与类不同，在一个 HTML 文档中，ID 选择器会使用一次，而且仅一次。
• 不能使用 ID 词列表: 不同于类选择器，ID 选择器不能结合使用，因为 ID 属性不允许有以空格分隔的词列表

语法:
ID 选择器前面有一个 # 号。

#intro {
  font-weight: bold;
}

通配符选择器

CSS2 引入了一种新的简单选择器 - 通配选择器（universal selector），显示为一个星号（*）。该选择器可以与任何元素匹配，就像是一个通配符。

* {
  color: red;
}