工作日志

一.知识总结

1.transform 属性，应用于元素的2D或3D转换，这个属性允许你将元素旋转，缩放，

移动，倾斜等。

用法：transform: none|transform-functions;

值：none 定义不进行转换；

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

translateX(x) 定义转换，只是用 X 轴的值。

translateY(y) 定义转换，只是用 Y 轴的值。

translateZ(z) 定义转换，只是用 Z 轴的值。

3.transition 属性设置元素当过渡效果。

值：linear 规定以相同速度开始至结束的过渡效果。

4.动画：

@keyframes animationName{
from {}
to {}
}

5.HTML元素完全按照源码中出现的先后次序显示——第一个段落、无序列表、第二个段落。

6.浮动：float属性

img {
float: left;
margin-right: 30px;
}

7.定位：position

静态定位是每个元素获取的默认值，它只是意味着“将元素放入它在文档布局流中的正常位置；

position 默认属性都是 static 。

8.相对定位：上 position:relative; 通过使用 top ， bottom ， left 和right 属性，相对于其他位置进行定位。

9.绝对定位：position:absolute生成绝对定位的元素；

10:固定定位：fixed 固定定位。

2.video的属性：

src 源；controls 控件；poster 视频封面，如果不设置则显示视频第一帧。

3.CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。

4.样式

（1）内联样式：通过元素的 style 属性来指定。

（2）内部样式：在 HTML 文档中，通过 style 元素来嵌入CSS样式

    <style type="text/css">

​ h1{

​ color:red;

​ }

​

5.选择器：标记选择器

tagName{

​ propertyName : propertyValue ;

​ ...

}

6.ID选择器：网页标签ID与ID选择器同名，适用此样式（建议：ID要唯一）

​ 元素编号可以通过元素的id属性来指定。

​ 后代选择器：空格即代表是后代。

7.元素尺寸：宽度（width），高度（height）。

8.四周边框粗细（border-width）属性来实现；

​ 四周边框风格（border-style）属性来实现；

​ 四周边框颜色（border-style）属性来实现；

​ 设置顶部边框粗细，风格，颜色（border-top）来实现。

二.心得体会

通过今天的学习，我觉得虽然内容比较少，但是接受的速度比较慢，因为都是一些新的没接触过的东西需要慢慢消化，今天的知识中浮动比较难，在晚上做习题的时候试了很多遍，希望接下来的学习轻松一点。