LAPTOP-J6J2CAOQ_20210524 李霞英
日志
一、知识总结
1.transform
transform的属性值
| 值名称 | 描述 |
|---|---|
| none | 不进行转换。 |
| translate(x,y) | 2D 转换。移动 |
| translate3d(x,y,z) | 3D 转换。父元素 transform-style: preserve-3d; |
| scale3d(x,y,z） | 3D 缩放转换。 |
| skew(x-angle,y-angle) | 沿着 X 和 Y 轴的 2D 倾斜转换。 |
| rotate(angle) | 2D 旋转，在参数中规定角度。 |
| rotate3d(x,y,z,angle) | 3D 旋转。 |
- ##### 过渡（transition）
属性：
property 指定属性的name。
duration transition：效果的时间。
timing-function ：效果的转速曲线。
delay ：效果开始前的延迟。
transition-timing-function 常用的值有：
linear： 规定以相同速度开始至结束的过渡效果
ease ：规定慢速开始，然后变快，然后慢速结束的过渡效果。
ease-in ：规定以慢速开始的过渡效果。
ease-out： 规定以慢速结束的过渡效果。
ease-in-out： 规定以慢速开始和结束的过渡效果。
3.布局
常用的布局有正常布局，CSS 表格布局，多列布局三种。
浮动(float):
清楚浮点的方式有：
方式（1）：clear
有三个值：
left ：停止任何活动的左浮动。
right ：停止任何活动的右浮动。
both ：停止任何活动的左右浮动。
方式（2）：
如果有浮动，需要定义一个父容器，并且要定义父容器宽和高。
4.常见的定位方式有
静态定位（static）
相对定位（ position:relative）
绝对定位（position:absolute）
固定定位（fixed）：
固定定位与绝对定位的工作方式完全相同，主要区别在于：绝对定位固定元素是相对
于 元素或其最近的定位祖先，而固定定位固定元素则是相对于浏览器视口本身。
粘性定位（position: sticky）：
是相对定位和固定定位相结合的定位方式，它允许被定位的元素表现得像相对定位一样，直到它滚动到某个阈值点（例如，从视口顶
部起10像素）为止，此后它就变得固定了。
二、心得体会
今天学习的一些内容的属性以及属性的值，我不太会应用，在练习过程中有些可以运行成功，有些运行了不显示结果，尤其是动画方面的知识，在浮动方面的知识掌握程度比较好，在定位方面的内容掌握不太好。
三、疑问
1.relativea和absolute的区别？
近期评论