全福网站设计认为,做好DIV+CSS的网页重构,有两个关键的概念必须要精通,你知道是那两个么?

发布时间:2012-05-14 浏览:2072


div+css 最近几年在国内的发展可谓是得到了大多数人的认同,大家也都接受了,并且得到了一直的好评,好多的网站都已经开始改版,利用这种技术,全福网站设计公司在做网站的时候遇到的或者说是一些写的体会吧,想拿出来和广大的网站制作爱好者分享下:

K1S$ZF~_6T1UO1XV}UYU_%X.png

网页重构,最主要的好处在于实现了网页设计的标准化,摒弃传统的表格布局方式,充分达到内容、表现和行为三者的分离,使得HTML代码更加容易阅读和维护,同时文件也变得更校例如,网站改版后,所有的网页文件大小都不到原来的一半,因此占用的服务器空间更小,运行效率也得到很大的提升,主页打开速度明显比以前更快。

DIV+CSS的网页布局方式,与传统的table布局有很大差异,因此在网页设计之前就要有一个详细的规划,对组成网页的各部分元素都进行命名,方便在CSS文件中进行样式定义,公共属性部分可以采用类名的方式来定义。在整个站点中,对于网站通用的样式可以定义一个公共的css文件,例如包括网页宽度、背景颜色、背景图片、文字默认大孝颜色、链接样式等,然后可以为每个网页定义一个单独的css文件,这样做非常有利于精简css文件的大小,避免出现引用混乱和难以维护的问题。同时,也要绝对避免使用行内css的方式,彻底实现内容和样式的分离。

全福网站设计认为,做好DIV+CSS的网页重构,有两个关键的概念必须要精通。

第一是float属性,因为在默认情况下,所有的div都是占据一整行的,因此对于常见的两列、三列等多列布局的设计,要正确设置float以及width属性来实现层浮动,达到我们所需要的布局效果,多列布局结束之后单独占据一行的其他层(比如通栏banner等),也要设置clear属性来清除层浮动。

第二是盒模式,对于任何一个div层,可以定义其宽度width、高度height、四周边框border粗细和样式,以及内容到边框的边界padding和边框到周围层的空白margin等属性,而层实际占据的空间则是上述属性相叠加的结果,正确设置这些属性能帮助我们实现紧凑而又美观的网页布局。盒模式的理解对于网页布局的设计至关重要,特别是不同浏览器中可能会有不一样的解释方式,甚至会由于1个像素的差异导致布局混乱,这个时候可以适当减小层的width或者height属性来进行微调。

DIV的嵌套也是一个需要重点说明的问题,我们都知道在table布局时要尽量减少嵌套,对于DIV也是一样,嵌套的弊端在于代码复杂、维护困难以及运行效率低,因此也要尽量将嵌套控制在3层之内。另一方面,对于多列布局的情况下,完全可以采用层浮动的方式实现,没有必要整体设置一个div来嵌入。


总之,DIV+CSS的网页布局方式有非常多的优点,建议网页设计者从最初开始就放弃table布局方式,这样非常有利于对css样式表的深入学习和应用。其实,DIV+CSS的网页布局方式并不复杂,只要了解一些基础知识,通过一个案例的实践过程就可以掌握,并且得到不断的提高。本人在这方面也是新手,欢迎能和广大从事网页设计的朋友们相互交流、共同进步。

 

 

相关推荐

  • 网站建设常见问题解答

    1、建立网站要多少钱?答:建立网站一般分为定制和套餐,定制是完全根据您的要求制作,您把具体的需求告诉我们的商务专员之后才能给您相应的合理报价,这需要电话或者见面来相互沟通;套餐是您只能在我们提供的套餐范围内选择,获得所购买的套餐服务项目和内 [更多]

    更新于2016-10-12 浏览 5425 次
  • 网站LOGO设计规范

    LOGO的应用一直是CIS导入的基础和最直接的表现形式,其重要性是不言而喻的,网络标识的设计尤其如此。一、标识的职能:作为独特的传媒符号,标识(LOGO)一直成为传播特殊信息的视觉文化语言。 [更多]

    更新于2016-05-09 浏览 7586 次
  • 淘宝客和购物分享网站有什么区别?

    购物分享也是属于淘客的不过更软性化一点 [更多]

    更新于2016-05-09 浏览 5944 次
  • 新手建站这三点很重要

    笔者是个好胜的人,一而再的小失败,让笔者暗自给自己憋了口气,一定要把这个重新做好,于是,又一个淘客网赚站出来了,呵呵,时间不长,也就才短短一个月多一点,但笔者分析整理了下,觉的里面有很多的东西. [更多]

    更新于2016-03-28 浏览 5380 次
  • 网站建设文章内容要如何去规划

     在搜索引擎而言,相似度低于40%的内容,搜索引擎就会认为是原创文章,相似度越高质量就越差,搜索引擎就会判断为伪原创或者采集。当然,原创文章的定义也不仅于此,搜索引擎发展的十几年,对于文章也是有一定识别能力的. [更多]

    更新于2016-03-24 浏览 5168 次
  • 新手建站这三点很重要

    空间,国内遍地空间商,开始的噱头不要太多,折扣啦,空间广告词啦一堆堆的,很多新手朋友看中其相当低廉的价格,头一昏脑一热就买了,结果被坑爹了,不是空间不稳定了,就是备案的让你抓狂,还有空间售后的鸟人,付款了之后,你就可有可无了. [更多]

    更新于2016-03-24 浏览 5663 次