20210524—王博

工作日志

一.知识总结

1.transform

用法:

transform:none 定义不进行转换。

translate(x,y) :定义 2D 转换。

translate3d(x,y,z) :定义 3D 转换。

translateX(x) :定义转换,用 于X 轴的值。

translateY(y) :定义转换,用于 Y 轴的值。

translateZ(z) :定义转换,用 于Z 轴的值。

2.动画

自定义动画:

@keyframes animationName{
    from {}
    to{}
}

animation-iteration-count:定义动画的播放次数。infinite 无限次

3.布局(排版)

正常布局流

浮动:Float属性(浮动内容需要遵循盒子模式,如:外边距和边界)

多列浮动

清除浮动:

footer {

​ clear: both;

}

clear 可以取三个值:left :停止任何活动的左浮动

right :停止任何活动的右浮动

both :停止任何活动的左右浮动

注意:如果有浮动,一定要定义一个父容器,而且一定要定义父容器宽和高。

4.定位

静态定位

相对定位:给元素加上 position:relative; 并不会改变元素的位置,需要使用 top , bottom , left 和

right 属性。(相对于其正常位置来定位)

绝对定位:position:absolute;

固定定位

粘性定位:position: sticky

二心得体会

今天学习的内容,老师讲的韩浩,但相对于我来说,理解起来挺有难度的,有些东西嵌套的比较多,搞不清楚使用的位置和应该怎样用,比较混乱和复杂,有时要练习一些东西的时候不知道那个位置里要用哪些元素。

标签

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