秀日措-20201029

知识总结

1.transform

transition:all 3s;/*过渡*/

transform:rotate(240deg);/*旋转*/

transform:scale(.4);/*缩放*/

transform:skew(45deg);/*倾斜*/

transform:translate(300px);/*平移*/

transform:matrix();/*扭曲(两行三列的三角函数矩阵)*/

2.keyform自定义动画

animation:change 3s ease 1s forwards infinite alternate inherit;

animation-----绑定动画 ,动画名称

3s-----动画播放时间

ease------动画播放轨迹

1s------延迟播放

forwards----让动画停到最后一帧

2----播放次数(两次)  infinite-----无线播放

alternate----来回播放、正负播放

inherit-------停止播放

盒子模型

小盒子:外边距

margin-top;20px;

margin-bottom:20px;

大盒子:内边距

padding-top:20px

padding:20px;

margin:0 auto;水平居中

bordre-width:1px;

border-color:red;

border-style:solid;

box-sizing:content-box:/*盒子实际大小*/   content-box-->不包含边框

box-shadow:0px 0px 50px yellow inset;/*水平距离 垂直距离 模糊距离 盒子阴影*/

border-radius:30px;/*圆角*/

border-bottom-right-radius:100px;/*右下角*/

块级标签和行级标签的属性转化

1.块级标签加float(浮动)就有了行级标签不独占一行的特性

特别注意:使用float时,一定外面加个容器包起来

学习心得

虽然今天只上了下午的课,但是讲的知识点还是很多的,,但是只要

认真听讲和记好笔记就没法跟着老师一起操作,感觉自己有点跟不上

节奏,再者自己下去独立做作业时就会出现各种问题,导致实验无法

得到该得的结果。

标签

评论

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1