---恢复内容开始---

div中嵌套了div速度将会同样很慢
 

   最近很多老板在我们公司做企业站的时候都会要求说:我要div+css的,不要表格建的那种,那样不利于优化。但我们发现就算给他们用div+css的形式做出的网站也没见他们做过什么优化,甚至连文章都没更新过。这是外话,我们就来谈谈难道真的用div+css制作出来的网站就打开速度就快,对搜索引擎就友好吗?
关于div+css的优点其实确实很多,这种布局方式大大精简了页面的代码量,减少了网页的体积,有利于网页的读取。而table的排版方式最初是由一位负责给报纸排版的人使用的,他的“发明”对于互联网可以说是起到了极大的推动作用。让传统的网页实现了丰富多彩的颜色和布局结构。在互联网发展的初期使用比较多的浏览器其实并非IE,而是美国的数家浏览器共存的局面,后来微软通过将IE与windows的捆绑才得到迅速的发展。直到最后又w3c组织对代码进行了规范之后table也才得到了快速的发展。
而后随着互联网的发展,人们对速度的要求越来越高,而table由于其天生的缺陷导致人们急于寻找新的方法来代替它,这就出现了div+css的网页制作方式。说这么多是想让大家了解一下这两种排版方式的历史,因此只能说div+css是现在比较流行也比较实用的排版方式,而你不能说table就不好,table的一些功能是div+css目前还无法替代的。
再来说说什么叫做div+css的滥用。大家都知道为什么我们不喜欢用table,就是因为table排版的话很多地方会需要嵌套的方式来实现我们需要的页面。而如果页面有很多这类嵌套那么你的网页体积将会大大增加,而浏览器在读取的时候是从<table>到</table>的顺序来读的,它只有在将整个table读取完的时候才能够将页面呈现出来。如果你嵌套过多的话可以想象一下你网页的速度将会是怎样的了。
而浏览器对于div+css形式的页面读取同样是遵循这个原则的,它也是从<div>到</div>来进行读取的。那么如果你的页面div中嵌套了大量的div速度将会同样很慢,而且嵌套太多的div也极容易会出现浏览器不兼容的问题。那么你这样做的页面跟table的嵌套又有什么区别呢?这就是我们要说的div滥用情况。一个div完全可以实现的效果就不要为了省事再去定义一个样式来。
那么如何来避免这种情况发生呢?这就需要对网页来进行web重构,对于web重构这个概念大家可以到百度上搜索一下。这是一个细致活,而且也是一个很考验网页设计人员能力的活。如果你懂的css又稍微懂些div,自己的网站是采用开源cms做的话,那么你自己就可以对网页进行重构。修改模板就可以了,但修改的过程中一定要注意浏览器的兼容性。
其实很多我们网站与浏览器不兼容的问题大都是因为对div使用不当,或者是过于滥用引起的。而table对浏览器的兼容性就要好很多,如果某个效果采用div会不可避免进行很多嵌套的话还是使用table更好一些。就是说用div+css与table制作页面,以达到对网页代码最大化的精简,同时又不丢失效果。
看完这些你应该明白了并不是div+css的就一定好,同样的页面效果有的网页设计人员仅用几个div就可以轻松实现,而有的网页设计人员却要用多于前者两倍甚至几倍的代码。

---恢复内容结束---

div中嵌套了div速度将会同样很慢
 

   最近很多老板在我们公司做企业站的时候都会要求说:我要div+css的,不要表格建的那种,那样不利于优化。但我们发现就算给他们用div+css的形式做出的网站也没见他们做过什么优化,甚至连文章都没更新过。这是外话,我们就来谈谈难道真的用div+css制作出来的网站就打开速度就快,对搜索引擎就友好吗?
关于div+css的优点其实确实很多,这种布局方式大大精简了页面的代码量,减少了网页的体积,有利于网页的读取。而table的排版方式最初是由一位负责给报纸排版的人使用的,他的“发明”对于互联网可以说是起到了极大的推动作用。让传统的网页实现了丰富多彩的颜色和布局结构。在互联网发展的初期使用比较多的浏览器其实并非IE,而是美国的数家浏览器共存的局面,后来微软通过将IE与windows的捆绑才得到迅速的发展。直到最后又w3c组织对代码进行了规范之后table也才得到了快速的发展。
而后随着互联网的发展,人们对速度的要求越来越高,而table由于其天生的缺陷导致人们急于寻找新的方法来代替它,这就出现了div+css的网页制作方式。说这么多是想让大家了解一下这两种排版方式的历史,因此只能说div+css是现在比较流行也比较实用的排版方式,而你不能说table就不好,table的一些功能是div+css目前还无法替代的。
再来说说什么叫做div+css的滥用。大家都知道为什么我们不喜欢用table,就是因为table排版的话很多地方会需要嵌套的方式来实现我们需要的页面。而如果页面有很多这类嵌套那么你的网页体积将会大大增加,而浏览器在读取的时候是从<table>到</table>的顺序来读的,它只有在将整个table读取完的时候才能够将页面呈现出来。如果你嵌套过多的话可以想象一下你网页的速度将会是怎样的了。
而浏览器对于div+css形式的页面读取同样是遵循这个原则的,它也是从<div>到</div>来进行读取的。那么如果你的页面div中嵌套了大量的div速度将会同样很慢,而且嵌套太多的div也极容易会出现浏览器不兼容的问题。那么你这样做的页面跟table的嵌套又有什么区别呢?这就是我们要说的div滥用情况。一个div完全可以实现的效果就不要为了省事再去定义一个样式来。
那么如何来避免这种情况发生呢?这就需要对网页来进行web重构,对于web重构这个概念大家可以到百度上搜索一下。这是一个细致活,而且也是一个很考验网页设计人员能力的活。如果你懂的css又稍微懂些div,自己的网站是采用开源cms做的话,那么你自己就可以对网页进行重构。修改模板就可以了,但修改的过程中一定要注意浏览器的兼容性。
其实很多我们网站与浏览器不兼容的问题大都是因为对div使用不当,或者是过于滥用引起的。而table对浏览器的兼容性就要好很多,如果某个效果采用div会不可避免进行很多嵌套的话还是使用table更好一些。就是说用div+css与table制作页面,以达到对网页代码最大化的精简,同时又不丢失效果。
看完这些你应该明白了并不是div+css的就一定好,同样的页面效果有的网页设计人员仅用几个div就可以轻松实现,而有的网页设计人员却要用多于前者两倍甚至几倍的代码。

div中嵌套div速度将会同样很慢的更多相关文章

  1. div中嵌套div中使用margin-top失效问题

    div中嵌套div中使用margin-top失效问题

  2. div中嵌套div水平垂直居中

    div中嵌套一个居中的div有很多方法,如果不想调整边距,有一个简单的方法: <div align="center" style="width: 200px;hei ...

  3. div中嵌套div水平居中,垂直居中

    方法一: div(父):display:table; div(子):display:table_cell;margin:0 auto;vertical-align:middle; 方法二: div(父 ...

  4. div中嵌套img元素,4px空白

    写布局的过程中遇到一个问题,在div中嵌套了img元素,没有指定div的高度,嵌套之后div高度始终比img高4个像素,没有设置内外边距,找不到原因. 除非强制div的高度为img的高度,才能使div ...

  5. 设置div中的div居中显示

    设置div中的div居中显示 方法一. <div class='big'> <div class='small'>box1</div> </div> s ...

  6. HTML里为什么不能在<p>标签中嵌套<div>标签

    学习过HTML语言的人都应该知道,在HTML里,有分块级元素和内联元素:例如我们常用到的div,o,ul,dl,table,h1...h6等,这些都是块级元素:而像a,b,i,em,img,span等 ...

  7. div中嵌套的多个div使用了浮动后居中的办法

    今天做网页的时候遇到了标题中的问题,网上查到了解决办法,记录一下一放以后忘记 <div class="wai"> <div style="float:l ...

  8. 大div中嵌套小div,点击大div时隐藏,点击小div不隐藏

    给小div添加一个click事件 <div onClick="event.cancelBubble = true">  //小div

  9. Div中嵌套一个div,怎么是里面的div居中?

    盒子居中是在写样式中经常遇到的问题,在这里说个我经常使用的方法~ 利用绝对定位:

随机推荐

  1. noNamespaceSchemaLocation前添加xsi

    在.Net中操作xml文档,给节点添加,xsi:noNamespaceSchemaLocation属性时,不可以使用 XmlElement eleRoot = doc.CreateElement(&q ...

  2. ps 网页布局

    910  1680  找一个页面作为参考   双击小手回到正常视角 新建组  把他们放到一个组里  新建组改名(创意专家)  放入一个图片 内发光投影  Shiftalt  复制 新建组  改名创意案 ...

  3. hdu2393Higher Math

    Problem Description You are building a house. You’d prefer if all the walls have a precise right ang ...

  4. hdu2309ICPC Score Totalizer Software

    Problem Description The International Clown and Pierrot Competition (ICPC), is one of the most disti ...

  5. PHP QR Code封装二维码生成教程

    今天搞了一下二维码封装在tp框架上运用. 找了下草料网, api接口要收费, 现在找到了两种方法来实现用PHP来实现创建二维码. 由于二维码生成,会使用到PHP的GD库, 我们要先在PHP.ini文件 ...

  6. PHP 表单防止刷新提交的方法

    当然,最直接的办法就是尽量不要使用自动提交的表单,然而,当我们需要网页主动post表单进行初始化时,就不得不面对这个问题了 -------------------------------------- ...

  7. 【python学习笔记02】python的数据类型2

    列表和元组之间的主要区别是:列表括在括号([])和它们的元素和大小是可以改变的,而元组在圆括号(),不能被更新.元组可以被认为是只读列表. 存储在一个列表中的值可以使用切片操作符来访问([]和[:]) ...

  8. 安装Jenkins后 启动时失败的问题解决

    命令行执行,java -jar jenkins.war,报错 ------------------------------- SEVERE: Container startup failed java ...

  9. Nginx 配置指令的执行顺序(九)

    紧接在 server-rewrite 阶段后边的是 find-config 阶段.这个阶段并不支持 Nginx 模块注册处理程序,而是由 Nginx 核心来完成当前请求与 location 配置块之间 ...

  10. Nginx 变量漫谈(二)

    关于 Nginx 变量的另一个常见误区是认为变量容器的生命期,是与 location 配置块绑定的.其实不然.我们来看一个涉及“内部跳转”的例子:     server {        listen ...