20210523—林多泰

日志

一、知识点总结

1、外边距:margin属性设置元素的外边距

(1)设置四周填充一致

margin:value

(2)使元素居中显示

margin:value auto;

2、内边距

padding设置元素的填充

3、盒子模型

(1)Content box:用来显示内容,可以通过width 和 height 设置大小

(2)Padding box: 区域外部的空白区域,大小通过 padding 设置。

(3)Border box: 边框盒包裹内容和内边距。大小通过 border 设置。

(4)Margin box: 盒子和其他元素之间的空白区域。大小通过 margin 设置

(5)margin不计入实际大小

(6)border-box用来定义替代盒模型的大小

4、display:display生成框的类型

(1)block:块元素、前后会带有换行符

(2)inline:内元素、前后没有换行符

(3)inline-block:元素呈现行内并保持宽和高的属性,行内块元素

(4)none:元素不做呈现,不占网页空间。

(5)visibility不显示但占用网页空间。

5、背景样式

(1)background-color:定义了CSS中任何元素的背景颜色

(2)transparent 指定背景颜色应该是透明的

(3)inherit 指定背景颜色,应该从父元素继承

(4)background-image: 在元素的背景中显示图像.

(5)background-repeat属性

​ no-repeat — 不重复

​ repeat-x —水平重复

​ repeat-y —垂直重复

​ repeat — 在两个方向重复

(6)background-size 可以设置长度或百分比值

(7)background-position 属性允许您选择背景图像显示在其应用到的盒子中的位置

(8)linear-gradient 线性梯度渐变

(9)scroll : 使元素的背景在页面滚动时滚动

(10)fixed : 使元素的背景固定在视图端口上

(11)background-clip 设置元素的背景是否延伸到边框、内边距盒子、内容盒子下面。

(12)border-box 背景延伸至边框外沿

padding-box 背景延伸至内边距外沿

content-box 背景被裁剪至内容区外沿

text 背景被裁剪成文字的前景色

6、处理文本

(1)writing-mode 切换文字的排列方向

(2)writing-mode 的值

horizontal-tb : 块流向从上至下

vertical-rl : 块流向从右向左

vertical-lr : 块流向从左向右

7、overflow 控制元素溢出式

(1)visible 默认值

(2)hidden 隐藏掉溢出,其余内容不可见

(3)scroll 显示滚动条

(4)auto 如果内容需要被修剪,则浏览器会显示滚动条以便查看其余的内容。

8、阴影

(1)box-shadow 属性可以设置一个或多个下拉阴影的框

(2)h-shadow 设置水平阴影的位置

v-shadow 设置垂直阴影的位置

9、opacity 设置元素的透明度,1:不透明。0:透明

二、心得体会

​ 今天一天的学习进度可以跟上,也可以听懂,受益不浅。但是有好多前一天的课的内容不是很明白,在编程序的时候有点迷惑,耗费的时间较长。继续加油。

标签

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