首页 > 代码库 > 4.1 什么是CSS样式表

4.1 什么是CSS样式表

上一章的课程里,我们学习了表单以及表单中的各种元素,常用的表单元素有:文本框( text)、密码框(password)、单选按钮(radio)、复选框(checkbox)、列表框(<select><option>)、按钮(button、submit和reset)、多行文本框(<textarea>)。另外,还学习了框架,包括框架的基本结构、如何创建多个复杂的窗口、框架窗口之间的链接等。

从本章开始,我们将学习CSS(Cascading Style Sheet,层叠式样式表),其中重点是样式的基本语法和如何创建常见的样式规则(如创建无下划线的超链接样式,设置细边框文本框样式,创建常见的文字、颜色等样式等);难点是内嵌样式、行内样式、样式表文件的使用场合。

为什么需要CSS样式表

通过定义CSS样式表,能让网页具有美观一致的界面,可以将网页制作得更加绚丽多彩。一个样式文件可以作用于多个页面,具有更好的易用性和扩展性,通过修改样式文件,能制作出内容相同,而外观不同的多姿多彩的页面。此外,使用样式表能有效地分离网页的内容与外观控制,从而便于美工与程序员之间的分工协作,发挥各自的优势。

为什么需要CSS样式表主要是基于以下几点原因:

(1) HTML标签的外观样式比较单一。

大家在学习前面几章时,不知发现没有?前面几章网页中的文字的字体、颜色、大小、超链接、间距等样式都比较单一,为了弥补这个缺点,就需要使用CSS样式表来对HTML标签进行控制,从而实现更加丰富多彩的效果。

(2) 样式表的作用相当于华丽的衣服。

同样的内容,采用不同的CSS样式文件,可以看到不同的布局和效果。从美工的角度来看,可以更容易地调整页面外观,调整页面里某个部分的文字或者图片等,从而实现复杂多变的页面效果,因此样式表相当于一个页面甚至一个网站的华丽的衣服。如图1所示,就是内容相同,外观不同的两个页面。

图1 内容相同样式不同的页面
图1 内容相同样式不同的页面

(3) 样式表能实现内容与样式的分离,方便团队开发。

由于当今社会竞争日趋激烈,分工越来越细,每个人做的事越来越单一,我们开发一个网站也不例外,往往需要美工和程序设计人员的配合,美工做样式,程序员写内容,为了迎合这种需要,就出现了样式表。样式表能把内容结构和格式控制相分离,使网页可以仅由内容构成,而将所有的网页格式通过CSS样式表文件来控制,从而方便美工和程序员分工协作、各司其职、各尽其能,为开发出优秀的网站提供了有力的保障。

点击下载第四章案例及作业资源 返回《HTML入门经典》教程列表

编辑:网页学习网
本文地址:http://www.lodidance.com/html/jc/520.html