一、五种居中的方式
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部分内容。刚看了几篇鸡汤,实现财务自由纯靠技术可能不得行,得把部分资金拿来做投资,梦想还是要有的,希望老夫早日实现😎