发表于: 2019-06-17 22:28:15

3 929


今天完成的事情:

几种居中的方式

1,margin:{0 auto};

2,display:flex;align-items:center;<垂直居中>justify-content:center;<水平居中>

3,文字垂直居中 line-hight与height数值相等

4,Padding填充搭配background-clip  对子元素设置background-clip:content-box; 背景剪辑到内容区外沿,再将padding设为外DIV-内div的一半(宽高差)

5,Absolute  对子元素设置 利用position:absolute;搭配left:50%;top:50%;在将margin设为负值,值为本div宽度的一半

对弹性盒子有了基本认识 :1flex-direction 2 justify-content 属性 3align-items 属性4flex-wrap 属性(align-content 属性用于修改flex-wrap)  5 排序order 6  对齐 (margin-right: auto; 将剩余空间放置在元素右侧) 8 居中(margin:auto;可以使得弹性子元素在两上轴方向上完全居中:9flex属性 例如(1  1   60%)




明天计划的事情:用flex 尝试完成任务5
遇到的问题:
收获:居中方式 以及FLEX基本认识



返回列表 返回列表
评论

    分享到