发表于: 2019-05-22 21:18:29
1 879
今天完成的事件
任务三师兄发现我的一个问文字不在图片居中,
最后师兄指出来问题出在我父类div calss=”tupian”
Tupian{
Position:absolute;
Text-align:left;
(这写成文字了靠左对齐,所以这里要写成center)
}
Class=center
Center{
Border-color:white;
Text-align:center;
(我这虽然写的是居中但问题如果字数过长就会自动向左对齐,因为子类里面的属性是要向父类里面的属性看齐。)
}
今天做任务5学习了
flex布局
disploy属性;理解为申明
disploy:foex;
justify-start:项目对齐容器左边
flex-end:右侧
cebter:中间
space-between:项目显示他们之间的间距离相等。
----------------------------------------------------------------------------------------
align-items属性
垂直对齐项目一下值
flex-start:项目对齐容器顶部
flex-end:对齐容器底部
center:垂直中心对齐
baseline:项目显示在容器基线处(这个还没用过不是很理解)
stretche:项目被拉伸以适应容器(这个也没用过)
-------------------------------------------------------------------------------------------------------------------
flex-direction属性
定于项目方向
row:项目与文本方向相同
row-reverse:项目与文本方向相对
(使用这个代码的话 就相当于你的元素A和B互 变成B在前A在后)
column:项目从上到下排列
column-reverse:项目从下到上;
-----------------------------------------------------------------------------------------------------
order属性
应用单个项目
.css{ order:0 1 2;}默认项目值为0进行正负调整
相当于 A B C 如用 B 用了order属性那么可以在里面用值把B调换到A 和C2个位置互换。
------------------------------------------------------------------------------------------------------------------
由不太熟练应用flex布局,现在遇到问题就是下面的字和图片移动不了上面去了,应该是父类或者图片元素一行挡住了,明天解决这个问看看是什么原因.
评论