今日查漏补缺

一、五种居中的方式
1.
.box1 {
position:relative;
}
.box1 dv {
position:absolute;
left:50%;
top:50%;
margin-top:-75px;
margin-left:-75px;
}

.box1 {
position:relative;
}
.box1 dv {
position:absolute
left:0;
top:0;
right:0;
bottom:0;
margin:auto;}

.box1 {
display:flex;
justify-content:center;
align-items:center;
}

.box1{
display:grid;
place-items:center center;
}

5…box1 {
position:relative;
}
.box1 dv {
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%)

二、动画里面的属性
animation需要与@keyframes配合用
animation-name 动画名称
animation-duration:持续时间
animation-timing-function:过渡类型
animation-delay 动画开始前延迟的时间
animation-direction：是否反向

三、css里面的属性选择器
a[title] 所有a标签含有title的元素
a[href^=“http://www.”] 所有以http://www.开头的
a[href$=".com"]所有以.com结尾的
a[href*=“sina”]{}给含有"sina"的元素

四、css层次选择器
后代选择器
.box p

子代选择器
.box>p

兄弟选择器
.box~p

相邻选择器
.box+p

五、定位
relative 相对定位 当子级是absolute时，应该给父级一个relative
absolute 绝对定位 要有父级，根据父级的定位而定位
fixed 固定定位 固定在某一个位置，不会因为滚动条的滑动而改变位置 会脱离文档流
static 静态定位
absolute会脱离文档流

六、五个兼容问题
两个盒子宽度都设置为50%时，会挤下来一个
IE低版本图片添加超链接会有蓝色边框
图片默认有间隙
双倍浮动BUG
按钮默认大小不一

七、写一个箭头向下的三角形
div {
width: 0;
height: 0;
border: 10px solid transparent;
border-top-color: red;
}

八、单行文本溢出显示省略号
overflow-hidden;
text-overflow:ellipsis;
white-space: nowrap;

九、清除浮动的四种方式
1）额外标签法（在最后一个浮动标签后，新加一个标签，给其设置clear：both；）
2）父级添加overflow属性（父元素添加overflow:hidden）
3）使用after伪元素清除浮动
.clearfix:after{ 伪元素是行内元素 正常浏览器清除浮动方法
content: “”;
display: block;
height: 0;
clear:both;
visibility: hidden;
}
.clearfix{
*zoom: 1;
}
4）使用before和after双伪元素清除浮动
.clearfix:after,.clearfix:before{
content: “”;
display: table;
}
.clearfix:after{
clear: both;
}
.clearfix{
*zoom: 1;}

十、10个H5新增的标签
header section aside footer video audio article nav hgroup(标题的补充内容)
embed：嵌入内容

十一、解决高度塌陷的问题
给父级高度
float：left；
display:inline-block;
overflow:scroll;
overflow:hidden;

十二、伪元素选择器
::first-line 文本第一行
::before 在元素内部的前面插入内容
::after 在元素内部的后面插入内容
::first-letter 文本第一个文字
::selection 未选中的

十三、多列布局
/* 指定多少列 /
column-count: 3;
/ 指定列的宽度 /
column-width: 200px;
/ 每一列之间的间距 /
column-gap:30px;
/ 定义列之间的边框 */
column-rule:8px solid deepskyblue;

今日预习了JS部分内容。刚看了几篇鸡汤，实现财务自由纯靠技术可能不得行，得把部分资金拿来做投资，梦想还是要有的，希望老夫早日实现😎