刘海鹤-20201029
一、笔记
动画transform
transition: all 3s ease-in 3s;匀速transform: rotate(360deg) ;旋转
transform: scale(0.7);缩放transform: translate(300px);平移
transform: matrix();扭曲 参数为两行三列的三角函数矩阵
overflow: hidden;子容器超出父容器的部分隐藏Ctrl+shift+delete清除运行程序
keyframes
forwards定格1s播放24帧 forwards infinite; 循环播放 alternate反复
nation名称 change播放时间 ease次数 running动画播放
@keyframes{0%{transform: scale(0.7);}
20%{transform: rotate(180deg);}
40%{transform: translateX(5);}
盒子模型
大盒子:内边距 padding-top:20px; padding:20px;
padding上右下左
小盒子:外边距 margin-top:20px margin-bottom:20px;
margin:20;
border: 1px black solid ;使小盒子在大盒子的中间
box-shadow: 0px 0px 50px blue inset;盒子阴影
box-sizing: content-box;盒子实际大小
border-radius: 50%;圆角
border-bottom-right-radius: 100px;右下角圆角
float: left浮动
块级标签和行级标签的属性转化
1块级标签加float(浮动)就有了行级标签不独占一行的属性
特别注意:使用浮动时一定外面加一个大的标签将浮动的标签
使他包含在大的标签里
二、心得
我们学习了动画以及盒子模型,在动画中有很多很多命令要记住,盒子也可以分为
大盒子和小盒子然后分别对大盒子和小盒子进行修饰大小阴影,圆角等,老师讲的太快了
感觉有点跟不上,很吃力
近期评论