html表格布局⽅式有那⼏种，前端⼏种常见的布局⽅式
1.静态布局(固定宽⾼)
2.弹性布局(flex)————常⽤
3.圣杯布局
flex：flex-group、flex-shrink、flex-basis
flex：auto/none/负数/⼀个长度或百分⽐/两个⾮负数/⼀个⾮负数和⼀个长度或百分⽐等
A，flex-group：当⽗元素有剩余空间时，⼦元素占据剩余空间的量
B，flex-shrink：当⽗元素的空间不⾜以展⽰所有的⼦元素，⽗元素没设置flex-wrap，⼦元素需要进⾏收缩的量
C，flex-basis：表⽰该⼦元素的初始宽度
4.⾃适应布局(为不同的屏幕分辨率定义的布局 @media媒体查询技术)
5.流式布局：(宽⾼⽤百分⽐，按屏幕分辨率调整，布局不发⽣变化)
6.响应式布局(使⽤meta标签，宽⾼随窗⼝调整⾃动适配，适应布局和流式布局的综合⽅式)
7.栅格布局
1).栅格(⽹格划分)：在⼀个特定区域内划分出有规律的格⼦，依靠这些格⼦进⾏有规律的版⾯布局。
使⽤栅格布局：bootstrap(12列)，element(24栏)，antDesign
2).栅格布局
container：栅格系统容器；rows：⾏；cols：列；gutters：各列间的空隙
3).栅格布局实现响应式布局
8.table布局(使⽤表格进⾏页⾯排版和样式设置)
1).⽤法
html表格元素display:table
display:table-cell，相当于td元素
display:table-row，相当于tr元素
table-layout:fixed | auto(默认)：table-layout 属性⽤于显⽰表格单元格、⾏、列；auto, ⾃动表格布局，列的宽度由单元格中最⼤内容的宽度决        定；fixed ，固定表格布局。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。