©2020-2024 ioDraw All rights reserved
<>浏览器内核+标签：
<>单行省略号
white-space:nowrap text-overflow:ellipsis overflow:hidden
<>多行省略号：使用到浏览器内核:-webkit- 谷歌浏览器
overflow:hidden text-overflow:ellipsis -webkit-box-orient: vertical;
-webkit-line-clamp: 3; display: -webkit-box;
<>行标签
a、em、span、i、strong、b
<>块级标签
div p h1-h6 ol<li(有序) ul<li(无序) dl<dt+dd(自定义列表) header foot form nav
<>行内块标签
img、button、input
<>三者之间的区别
行标签：不能设置宽度和高度，只能在一行进行显示，不可以设置margin，可以设置padding和border
块级标签：独占一行，可以设置宽高.padding margin border 行内块：在一行展示，能设置宽高,margin padding border
display:block 变为块级元素 display:inline 变为行内元素 display:inline-block 变为行内块元素
<>盒模型
普通盒模型：margin + border + padding + content
怪异盒模型：margin + content(border+padding+content)
普通盒模型变为怪异盒模型使用的是box-sizing:border-box
<>使用css制作三角形
<html> <head> <style> div{ /*制作一个朝上的三角形 ，这里的宽度必须要写 否则不会生效*/ width:0
border-width:100px border-style:solid border-color:transparent transparent red
transparent} </style> </head> <body> div </body> <html>
<>margin塌陷问题的解决
塌陷现象分为两种：
一种是兄弟塌陷
另外一种是父子塌陷
塌陷出现的方式：当两个盒子同时出现margin-bottom和margin-top,本来两者之间的的距离是两个margin之间的和
，而出现的是两者的最大值，这样就导致了塌陷的问题 解决方式：使用伪元素 使用overflow:hidden 使用padiing或者boder
<>盒子水平垂直居中的几种方式
1.使用flex布局 justify-content:center; align-items:center
2.使用定位
3.使用grid布局 display:grid justify-content:center; align-items:center
4.使用margin: 0 auto
<>路径的几种方式
分为两种：相对路径 绝对路径 img标签内部的属性是以键值对的形式存在的
<>格式化标签 （成对存在的）
<b>标签</b> <strong>标签</strong> <em>标签</em> <i>标签</i> <del>标签</del>
<sub>标签</sub> <sup>标签</sup> <s>标签</s> <ins>标签</ins> <br /> <hr />
<>Css三大特性
1.继承性 2.层叠性 3.优先级
<>文本属性
text-indent首行缩进 text-align:center:水平居中 text-decoration: overline; 文本上方线条
text-decoration: line-through; 文件中间出现线条 text-decoration: underline; 文本下面出现线条
<>css复合选择器
后代选择器：使用空格分开 子集选择器：使用 > 并集选择器：使用, 伪类选择器： 链接伪类选择器： a:link：选择所有被访问的链接
a:visited：选择所有已被访问 a:hover：选择鼠标指针位于其上的链接 a:active：选择活动链接（鼠标按下未弹起的链接）
input:focus：点击Input获取焦点
<>重点：敲黑板！！！
<>大家可以看下一篇文章继续学习