CSS入门与选择器详解：从基础到高级应用-优快云博客

1.CSS的引入方式一共有三种：行内样式、内部样式表、外部样式表。

（1）行内样式：通过style属性引入css样式，可以直接在标签里面添加style属性引入。

（2）内部样式表：在style标签里面写css样式，通过style标签引入。

（3）外部样式表：css代码保存到外部的css文件中，html文件通过link标签引用该css样式表（外

部样式表)。

2.css常用的几种选择器:

（1）元素选择器:通过选择html标签设置css样式

例如：直接选取p标签设置文本颜色。

（2）类选择器：通过设置class类设置css样式

注意：class命名不能以数字开头

例如：设置类名为apple的标签中的文本颜色

(3) ID选择器：通过设置ID来设置css样式

注意：ID命名不能以数字开头

例如：设置ID为select的标签中的文本颜色

（4）后代选择器写法为：div p

例如：选择 div标签里面的所有子元素为p标签

（5）直接后代选择器写法为：div>p

例如：选取div标签里面的直接子元素p标签

（6）相邻兄弟选择器写法为：div+p

例如：选择紧跟div标签的首个p标签

（7）兄弟选择器写法为：div~p

例如：选择紧跟div标签的所有p标签

（8）结构选择器常用结构选择器为：div p:nth-child(2){} 选择其父元素（div）的第二个子元素p标签

例如：常用结构选择器：div p:nth-of-type(4){

} 选择其父元素（div）中p元素的第四个元素

其它选择器：:last-child:选择属于其父元素最后一个子元素每个元素。

:last-of-type:选择属于其父元素的最后元素的每个元素。

:first-child:选择属于父元素的第一个子元素的每个元素。

:first-of-type:选择属于其父元素的首个元素的每个元素。

（9）属性选择器写法为：属性选择器以[attribute]包裹，详细的可以参考w3c手册

（10）注意：在 CSS 中，选择器是选取需设置样式的元素的模式。

（11）1、字体和文本

CSS字体属性定义字体，加粗，大小，文字样式.

所有CSS字体属性

Css文本属性定义字体颜色、文本对齐、行高等。

所有CSS文本属性。