zoukankan      html  css  js  c++  java
  • DIV+CSS布局

    页面布局一般有三种方式:

    1. 表格布局
    2. 框架布局
    3. DIV+CSS布局

    当中。DIV+CSS布局符合W3C标准,眼下已成为网页布局主流。

       <div>标签的主要作用是用于设定文字、图片、表格等的摆放位置。

    当把文字。图片等放在<div>标签中时,该标签被称为“DIV块”或“DIV元素”或“DIV层”。 

    使用CSS和DIV能够非常好的解决图像或文字定位的难题,通过DIV和CSS结合使用,网页设计人员能够精确的设定内容的位置,还能够将定位的内容上下叠放。 使用DIV+CSS布局,可先先将页面内容的语义或结构确定下来而不是先考虑外观。

    一个结构良好的XHTML页面能够通过CSS以随意外观表现出来。

    CSS布局能实现真正意义上的结构和外观的分离,与传统的TABLE网页布局相比,具有下面4个显著优势

    1、表现和内容相分离。

    将设计部分剥离出来放在一个独立样式文件里,XHTML文件里仅仅存放文本信息。
    2、提高搜索引擎对网页的索引效率。用仅仅包括结构化内容的XHTML取代嵌套的标签,搜索引擎将更有效地搜索到你的网页内容,并可能给你一个较高的评价。


    3、提高页面浏览速度。对于同一个页面视觉效果,採用DIV+CSS重构的页面容量要比TABLE编码的页面文件容量小得多,前者一般仅仅有后者的1/2大小。

    给用户最直观的体验就是网页打开速度快了非常多,能给用户更好的体验。
    4、易于维护和改版。你仅仅要简单的改动几个CSS文件就能够又一次设计整个站点的页面。   

     利用DIV和CSS的定位技术进行网页的布局是如今主流的页面布局模式,是TABLE页面布局的替代技术。採用CSS+DIV布局的页面容量要比用TABLE布局的页面文件小非常多,前者一般仅仅有后者的1/2大小,节省了大量的带宽,同一时候减少了站点改版的成本。W3C组织提供对CSS代码的验证服务,地址在:
    http://jigsaw.w3.org/css-validator/

查看全文
  • 相关阅读:
    python基础之列表的坑
    python基础之字典篇
    坦克大战[源码] 你懂得
    java例程练习(键盘事件)
    android基础(对话框风格Activity实现)
    android基础(Activity)
    android基础(开发环境搭建)
    android基础(android程序的后台运行问题)
    java(敲 七)
    java例程练习(匿名类用法)
  • 原文地址:https://www.cnblogs.com/ldxsuanfa/p/10572238.html
  • Copyright © 2011-2022 走看看