DIV+CSS布局和TABLE布局的优缺点

HTML5学堂:TABLE布局是早以前CSS不存在的时候兴起的,是对TABLE标签的不正规使用,Table标签就是表格,是用来显示数据的,而不是用来布局网页的,虽然它有时候布局网页很简单。现在绝大多数的网站都是用DIV+CSS布局。这两种布局各有各的优点。

一.div+css布局的好处:

1.符合W3C标准,代码结构清晰明了,结构、样式和行为分离,带来足够好的可维护性。

2.布局精准,网站版面布局修改简单。

3.加快了页面的加载速度(最重要的)(在IE中要将整个table加载完了才显示内容)。

4.节约站点所占的空间和站点的流量。

5.用只包含结构化内容的HTML代替嵌套的标签,提高另外搜索引擎对网页的搜索效率。

二.table布局的好处(table布局也不是一点用的没有,这点是毋庸置疑的)

1.容易上手。

2.可以形成复杂的变化,简单快速。

3.表现上更加“严谨”,在不同浏览器中都能得到很好的兼容。

原文发布于微信公众号 - HTML5学堂(h5course-com)

原文发表时间:2015-12-02

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端小作坊

CSS vs JS动画:谁更快?

Javascript 动画怎么可能总是和 CSS transition 一样快,甚至更快呢?到底是什么秘密呢?Adobe 和 Google 是怎么做到让他们的富...

2362
来自专栏贤羽的前端小栈

探索 PHP 与 Vue 通用直出模板方案

我们通常说的“页面直出”,其实就是服务端渲染(SSR, Server-Side Render)。最初的 JS SPA 方案有个常见的问题,就是脚本没有加载执行完...

2.8K2
来自专栏Golang语言社区

【Go 语言社区】算法课程 第一季 第5节 回文检查

回文概念:大致就是把这个数倒过来念数字还是和原来的一样. 运行结果: 代码: package main import ( "fmt" ) //...

3214
来自专栏Jackson0714

JavaScrpit判断横竖屏

1263
来自专栏向治洪

react-native-android之初次相识

作为一名Android开发者,我的感觉就是,一步一卡,卡的潇洒。 但是我还是要学react-native,不要问我为什么,因为我相信一门解决了原生app,开...

1826
来自专栏腾讯大讲堂的专栏

打造H5动感影集的爱恨情仇【动画性能篇】

作者:谭照强,热爱折腾前端,喜欢新奇创意的程序员,业余喜欢玩摄影,弄咖啡。 “你听说过动感影集么?” 动感影集是QQ空间新功能,可以将静态的图片轻松转变为动态的...

25212
来自专栏Jackson0714

JavaScrpit判断横竖屏

2556
来自专栏你不就像风一样

Comfort - 一款MarkDown风格的博客园主题

目录和返回顶部一直位于右下角,鼠标移入显示,移出隐藏。注意,在手机端是不显示目录按钮和返回顶部按钮。

2523
来自专栏Android机动车

Android 8.0 之自适应图标

Android 8.0 (API 26)引入了自适应图标,可以在不同的设备上显示不同形状的图标。例如,一个app 如果采用了自适应图标,那么它就可以在一家的 O...

1614
来自专栏xingoo, 一个梦想做发明家的程序员

CSS布局那点事儿

布局 最开始老的一代网站开发,布局都是通过表格实现的。 这样可以形成规整的网格布局,但是也会带来一定的复杂性。比如想要新增某个页面元素,就有可能要改动整个表格...

2255

扫码关注云+社区