表格布局可用于居中对齐。今天我们就一起来学习一下这个小技巧吧。
HTML 表格意味着使用带有原生
标签的表格，而 CSS 表格模拟与 HTML 表格相同的表格模型，但具有 CSS 属性。
我们先看下面这个html表单对应的CSS。
表 { 显示：表 }
tr {显示：表格行}
thead { 显示：表头组 }
tbody { 显示：表行组 }
tfoot{显示：桌腿组}
列 { 显示：表列 }
colgroup { 显示：表列组 }
td, th { 显示：表格单元格 }
标题 { 显示：表格标题 }
动态水平和垂直居中
代码是：
身体 {
黑色的;
背景：粉色；
显示：表；
宽度：100%；
高度：100%；
}
。盒子 {
显示：表格单元格；
垂直对齐方式：居中；
对齐文本：居中；
}
双线
双线
动态水平居中
前端开发中常用的技巧是margin: 0 auto，在宽度已知的情况下实现居中对齐，并且display:table;margin: 0 auto;当宽度不确定时达到水平对齐。
代码是：
文档
*{
保证金：0；
填充：0；
}
.btn{
显示：表；
内边距：8 像素 x 16 像素；
背景颜色：水绿色；
框架：1px实心#ddd；
颜色：#fff；
保证金：0 自动；
}
对话
创客青年博客~
版权声明
本文仅代表作者观点，不代表Code前端网立场。
本文系作者Code前端网发表，如需转载，请注明页面地址。
code前端网
发表评论:
◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。