display
- block块元素
- inline 行内元素
- inline-block 行内块元素
- none 显示无元素
- table 表格元素
- list-item列表元素
- flex 弹性元素
- grids网格元素
行内元素和块元素区别
| 块元素 | 行内块元素 | |
|---|---|---|
| 独占一行 | 不会独占一行 | |
| 可以设置宽高 | 不能设置快高 | |
| 自上而下排列 | 自左而右排列 |
选择器
1.选择器是什么？
- 选择器就是选择元素的方式
- 选择元素方式的多样化造成选择器的多样化
选择器的分类
一、全局选择器：
*通配符：用于选择所有元素
二、基础选择器
- 元素选择器：选择所有标签
- id选择器：选择一个标签
- class选择器：选择一组标签
三、属性选择器
通过标签的属性匹配元素
所有的属性选择器都以方括号括起来
[attr]
表示带有以 attr 命名的属性的元素。
[attr=value]
表示带有以 attr 命名的属性，且属性值为 value 的元素。
[attr~=value]
表示带有以 attr 命名的属性的元素，并且该属性是一个以空格作为分隔的值列表，其中至少有一个值为 value。
[attr|=value]
表示带有以 attr 命名的属性的元素，属性值为“value”或是以“value-”为前缀（"-"为连字符，Unicode 编码为 U+002D）开头。典型的应用场景是用来匹配语言简写代码（如 zh-CN，zh-TW 可以用 zh 作为 value）。
[attr^=value]
表示带有以 attr 命名的属性，且属性值是以 *value *开头的元素。
[attr$=value]
表示带有以 attr 命名的属性，且属性值是以 *value *结尾的元素。
[attr*=value]
表示带有以 attr 命名的属性，且属性值至少包含一个 *value *值的元素。
[attr operator value i]
在属性选择器的右方括号前添加一个用空格隔开的字母 i（或 I），可以在匹配属性值时忽略大小写（支持 ASCII 字符范围之内的字母）。
[attr operator value s] 实验性
在属性选择器的右方括号前添加一个用空格隔开的字母 s（或 S），可以在匹配属性值时区分大小写（支持 ASCII 字符范围之内的字母）。
四、伪类选择器
伪类选择器的标志是 单冒号 :
:link:active:hover:visited-
:focus匹配焦点元素（部分元素有焦点：表单元素，超链接） -
:nth-chird()匹配第几个元素 -
:first-chird()匹配第一个元素 -
:last-chird()匹配最后一个元素 -
:root匹配根元素 -
:not()匹配不是某个元素的元素 -
:checked检查选中只能设置给单选复选
五、伪元素选择器
-
::first-letter选中文本的第一个字母 ::after::before-
::first-line选中文本的第一个行
六、组合选择器
组合选择器就是把上面这五类组合在一起使用
- 分组选择器
,：使用,组合 - 后代选择器：使用空格组合
- 子元素选择器：使用
>组合 - 相邻兄弟选择器：使用
+组合
1.元素是什么？
在HTML中，元素由三部分构成
- 开始标签
- 内容
- 结束标签
2.标签是什么？
标签就是带有尖括号的关键词
3.元素/标签用途是什么？
标签用于描述网页内容。通过标签告诉浏览器我是什么？
4.设置html标签的人叫什么
蒂姆伯纳斯（绰号：万维网之父）
5.元素类型
行内元素：也叫”内联元素“
块元素：把元素显示为块元素
行内块元素：把元素显示为行内块元素
none：把元素显示为无
