CSS常用布局类型
16lz
2021-04-11
之前有一篇文章《css块级元素垂直居中常用布局方式》主要介绍了绝对布局和flex布局，其实这两种布局也不是只局限在块级元素情形之中，需要做一些矫正。
1.flex我们一般用于有多个元素需要在横向或者纵向均匀分布，通过align-items和justify-content来控制这两个轴。
2.绝对定位常用于对单一元素相对父元素的位置布局，且位置比较灵活。
本篇在此基础之上又要做3点补充：
3.在页面多列、多行布局中，其实还经常会应用margin方式，而且会和css函数calc(100% - 100px);结合使用来定义页面中主要布局块的宽高。在设定了宽以后，就可以通过margin:0 auto;的方法，来让元素左右居中。
4.单行元素居中的布局，经常会用到text-align和vertical-align，需要注意的是，text-align是用在外层元素上，使内部的行内元素左右居中。而vertical-align是用在内部行内元素上，可以理解成使自己的中线和当前行的中线对齐。而且需要在外部元素上，使height等于line-height。
5.float在h5端似乎用的比较少，可以简单的让元素水平顶着父元素的边框。
你的鼓励让我更有动力
赞赏
0人进行了赞赏支持
更多相关文章
- Dom元素增加删除,修改,查找
- CSS选择器
- python列表
- dom树元素的增删改查
- 【JavaScript案例】视口高度，元素位置、滚动高度等位置属性详解及
- Python中tuple和list有什么区别?Python入门!
- JavaScript:实例演示dom元素的增删改查操作
- Python列表的常用方法
- 0406作业-dom元素的增删改查