简介： HTML基本理解day8 ｜ 青训营笔记

1.5.2 行内样式表

行内样式表(内联样式表 是在元素标签内部的 style 属性中设定CSS 样式 适合于修改简单样式

<div style="color: red; font-size:12px;">青春不常在，抓紧谈恋爱</div>
复制代码

style其实就是标签的属性，在双引号中间，写法要符合CSS规范，可以控制当前的标签设置样式

由于书写繁琐，并且没有体现出结构与样式相分离的思想，所以不推荐大量使用，只有对当前元素添加简单样式的时候，可以考虑使用行内样式表设定CSS，通常也被称为行内式引入

1.5.3外部样式表

实际开发都是外部样式表.适合于样式比较多的情况.核心是样式单独写到CSS文件中，之后把CSS文件引入到HTML页面中使用

引入外部样式表分为两步:

1.新建一个后缀名为css的样式文件，把所有CSS代码都放入此文件中 2.在HTML页面中，使用标签引入这个文件。<link rel="stylesheet" href="css文件路径">

1.生成标签直接输入标签名按tab键即可 比如 div然后tab键，就可以生成<div></div>

2.如果想要生成多个相同标签 加上就可以了比如div3就可以快速生成3个div

3.如果有父子级关系的标签，可以用>比如u>li就可以了

4.如果有兄弟关系的标签，用+就可以了比如div+p

5.如果生成带有类名或者id名字的，直接写demo或者#twotab键就可以了

6.如果生成的div类名是有顺序的，可以用自增符号$

7.如果想要在生成的标签内部写内容可以用{)表示

CSS的复合选择器

在CSS中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在基础选择器之上基本选择器进行组合形成的。

复合选择器可以更准确、更高效的选择目标元素(标签)

复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的

常用的复合选择器包括:后代选择器、子选择器、并集选择器、伪类选择器等等

1.1后代选择器（重要）

后代选择器又称为包含选择器 可以选择父元素里面子元素。其写法就是把外层标签写在前面，内层标签写在 后面，中间用空格分隔。当标签发生嵌套时，内层标签就成为外层标签的后代。语法:元素1元素2{样式声明}

上述语法表示选择元素1里面的所有元素2(后代元素)。 例如:ul li { 样式声明 } /* 选择 ul 里面所有的li标签元素*/

元素1和元素2中间用空格隔开

元素1是父级，元素2是子级，最终选择的是元素2

元素2可以是儿子，也可以是孙子等

只要是元素1的后代即可，元素1和元素2可以是任意基础选择器