发表于: 2018-08-22 21:48:16
1 626
今天完成的事情:
做了任务5,用ps一键切图,切下来任务资源,用到;了给盒子加背景颜色,百度找到的
background-image: url("./img/ptt5.png");
引用的图片可以作为盒子的背景,还可以再给背景加一个背景色,但可以直接一键切图所以就用不到。
用绝对定位把符号定位到左上角,用
margin: 0;
padding: 0;
让元素紧贴边缘。
还用到了flex任何一个容器都可以指定为 Flex 布局。
display: flex;
flex-direction 设置主轴对齐方式 默认 row x轴从左到右;
flex-wrap 子元素换行的方式 默认nowrap ;
flex-flow flex-direction和flex-wrap的简写 默认row nowrap;
justify-content 子元素的对齐方式 默认flex-start 左对齐align-items align-content
1、flex-direction 决定主轴的对齐方向,分别有四个属性:
row
(默认值):主轴为水平方向,起点在左端。
row-reverse
:主轴为水平方向,起点在右端。
column
:主轴为垂直方向,起点在上沿
。column-reverse
:主轴为垂直方向,起点在下沿。
了解了css语言规范,css也是要按照要求来写。
是从盘符开始的路径,形如
C:\windows\system32\cmd.exe
相对路径:是从当前路径开始的路径,假如当前路径为C:\windows
要描述上述路径,只需输入
system32\cmd.exe
但还有一种写法./img/ptt5.png
直接就可以导出。
今天再一次用到了绝对定位。
明天计划的事情: 尽量完成任务5.
遇到的问题:
ps多次出现问题,没有解决,一开始不懂flex,看了一上午的资料才明白一些切图时也出现了很多问题,多次重启ps才解决,加背景色以及透明时总是出现问题,最后还是把背景色切了下来。
一开始用的垂直居中改变图片位置,后来发现不合适,就改用了绝对定位。
收获:知道了怎么用flex,一键切图也可以用了,绝对路径与相对路径的不同了解了。任务5做了个开头。
评论