这次给大家带来html的表格应该怎样布局，布局html的表格注意事项有哪些，下面就是实战案例，一起来看一下。
HTML 文档中的元素是一个接着一个排列的，只是简单地在在块级元素的前后加上拆行，是一种流水布局。但是，我们所见到的 Web 页面按照一定的规则布局排版的（通常是多列的），所以就要借助一定的方法来实现这种布局，通常的解决方案是：使用区块元素
或 表格（）来布局 Web 页面的内容。
CSS 文件/*整个点餐系统的界面*/ #container { width: 600px; margin: 100px; /*取消单元格边框之间的边距*/ border-spacing: 0; } /*点餐系统界面的头部*/ #header { background-color: red; text-align: center; } h1 { margin-bottom: 0px; } /*点餐系统界面的菜单*/ #menu { background-color: #FFD700; height: 200px; width: 150px; } #dishes { padding-top: 10px; padding-left: 10px; line-height: 20px; } /*点餐系统界面的菜品详情*/ #content { background-color: gray; height: 200px; width: 450px; } /*点餐系统界面的尾部*/ #footer { background-color: blue; height: 25px; text-align: center; }
使用表格进行布局，是一种较老的布局解决方案。并不推荐使用，我们应该总是使用表格来显示表格化的数据。
HTML 文档
Island estaurant
点菜系统 | |
| 菜品 小鸡炖蘑菇 家常豆腐 酸辣土豆丝 | 小鸡炖蘑菇： 幼鸡一只 |
| 世俗孤岛的餐厅 | |
相信看了这些案例你已经掌握了方法，更多精彩请关注创想鸟其它相关文章！
立即学习“前端免费学习笔记（深入）”；
相关阅读：
怎样让移动端的网页内容自适应
table表格中的内容溢出应该如何处理
在HTML中iframe与frame有哪些区别
以上就是HTML的表格应该怎样布局的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1545616.html
微信扫一扫 
支付宝扫一扫 
