DIV+CSS技术在网页设计中的应用

摘　要：

摘　要：层叠样式表技术经过多年的发展，采用DIV+CSS技术对网站进行网页布局。本文结合网页设计经验从DIV+CSS优点入手，对网页布局结构进行阐述，并探讨了CSS的引入方法。

关键词：

关键词：网页设计　层叠样式表　布局

      Div全称division意为“区分”使用?DIV?的方法跟使用其他?tag?的方法一样。CSS是Cascading?style?Sheets的简称，中文译作“层叠样式表单”，在网页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景等设置效果，更加精确的定位。只要对相应的代码做一些修改，就可以改变同一页面的不同部分。

　　1　Div+CSS的优点

　　CSS编写容易，缩减了页面代码，提高了页面浏览速度,降低了带宽成本；强大的字体控制和排版能力；提高易用性，更好地控制页面布局；表现和内容相分离。

　　2　常用网页结构

　　根据个人网页设计经验，结合长沙职业技术学院二级网站设计，得出以下常用网页结构：“国”字型、左右框架型、上下框架型、封面型、Flash型。

　　其一，“国”字型或“同”字型，即最上面是网站的标题以及横幅广告条，接下来就是网站的主要内容，左右分两列小条内容，中间是主要部分，与左右一起到底，最下面是网站的一些基本信息、联系方式、版权声明等。

　　其二，上下框架型与上面类似，区别仅仅在于是一种上下分为两页的框架。

　　其三，左右框架型，是一种左右为分别两页的框架结构，一般左面是导航链接，最上面一般一个小的标题或标致，右面是正文、显示内容。

　　其四，Flash型与封面型结构是类似的，只是这种类型游戏网站或校庆网站等。由于Flash强大的功能，页面所表达的信息更丰富，其视觉效果及听觉效果如果处理得当，绝不差于传统的多媒体。

　　其五，封面型基本上是出现在一些网站的首页，精美动画，几个简单的链接或者一个“进入”的链接甚至直接在首页的图片上做链接进入。

　　3　在HTML中引入CSS的方法

　　3.1　行内式

　　行内式是在标记的style属性中设定CSS样式。只对局部网页设置有效，，对于栏目设计比较多一种。但是修改比较麻烦，没有体现出CSS的优势，一般情况不推荐使用。

　　例如：

本文编号：14544