20210523—张晨曦

日志

一. 知识总结

1. 外边距

设置四周外边距 margin
让块元素横向居中显示 margin: value auto;
外边距折叠 margin-bottom

2. 内边距(填充)

设置四周填充 padding

3. 盒子模型

3.1 盒模型的各个部分

Content box 显示内容 通过width 和 height设置
Padding box 区域外部的空白区域 通过 padding 相关属性设置
Border box 边框盒包裹内容和内边距 通过 border 相关属性设置
Margin box 外面的区域 通过 margin 相关属性设置

3.2 标准盒模型

设置的是width 和 height

3.3替代盒模型(IE盒模型)

通过为其设置 box-sizing: border-box 来实现。

3.4 盒子模型和内联盒子

4.display:用inline-block值

5. 背景样式

名称 属性 属性值
背景颜色 background-color
背景图片 background-image
控制背景平铺 background-repeat no-repeat — 不重复repeat-x —水平重复等
调整背景图像的大小 background-size cover /contain
背景图像定位 background-position top/right
渐变背景 background-image
多个背景图像 background-image
背景附加 background-attachment scroll /fixed/local
background-clip background-clip border-box/padding-box/content-box/text
使用background background background-clip/background-color/ background-image /等

6.处理不同方向的文本

6.1 书写模式

horizontal-tb : 块流向从上至下。横向

vertical-rl : 块流向从右向左。纵向

vertical-lr : 块流向从左向右。纵向

7.溢出的内容

overflow属性:

visible 内容不会被修剪 呈现在元素框外
hidden 隐藏掉溢出 内容是不可见
scroll 显示滚动条
auto 以便查看其余的内容

8.CSS 的值

8.1 修饰字体文字

8.2 阴影

用box-shadow 修饰:

h-shadow 水平阴影的位置(允许负值)
v-shadow 垂直阴影的位置(允许负值)
blur 模糊距离
spread 阴影大小
color 阴影颜色
inset 改变阴影内侧阴影

8.3 透明度

用opacity设置,1 为不透明, 0 为完全透明

8.4 鼠标样式

用cursor设置, 有pointer 、 wait 、 help 、 copy 、 crosshair这四种属性值。

二.心得体会

通过老师一点点的带入,慢慢有了编程的一些感觉,我会继续跟着老师的节奏来学习这一门语言,加油。

三. 疑问

公司的全称是什么?

标签

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