CSS样式表在网页制作中的应用.doc

China ComputerCommunication 随着Internet的不断普及和飞速发展，网络已经成为人们获取、 发布和传递信息的主要渠道之一，在人们的工作、生活、学习和娱乐 中起着非常重要的作用。上网已经渐渐成为人们的一种习惯，网络上 的信息主要是通过网站来发布实现的，而网站又是由不同的网页构成 的。在制作网页的过程中，既需要设计合理的字体和布局，还需要考 虑兼容不同浏览器。为了方便解决这些难题，在网页的构建过程中引 入CSS样式表，是一个不错的选择。 一、CSS样式表概述 CSS是Cascading Style Sheet 的缩写，译作“层叠样式表单”。 它是一种在网页制作过程中经常用到的技术。CSS样式表其实是一组 样式，它增加了更多的样式定义方法来辅助HTML。样式就是用一个 指定的名字来标识和保存的一组有关字符和段落格式的选项集合。其 实，我们很早就已经与“样式”打过交道了。在Word的“格式”菜 单中的“样式项”里，提供了多种样式，如“标题1”、“标题2”、 “正文”等。只要选定文字，然后选择不同的样式，所选定的文字就 会自动改变字体、字号、对齐方式、字间距等。同样，我们可以通过 CSS来规定网页元素的各种样式，如颜色、位置、大小等。 二、CSS样式表的优势 CSS样式表是用于（增强）控制网页样式并允许将样式信息与网 页内容分离的一种标记性语言。通过使用CSS样式表，不仅可以对文 字格式进行设置，还可以更加精确地控制布局、字体、颜色、背景和 其他图文效果，从而避免在标识字符和设置段落格式等操作时重复定 义需要的样式，提高网页编辑的效率。 CSS是对以前的HTML（HTML3.2以前的版本）语法的一次重 大革新，是DHTML（动态网页）的一部分。建立CSS的意义在于把 对象真正引入到HTML中，使其可以使用脚本程序（如JavaScript、 VBscript）调用和改变对象属性，从而使网页中的对象产生动态的效 果，这在以前的HTML中是无法实现的。CSS甚至超越了WEB页面 本身的显示功能，把样式扩展到多种媒体上，显示了难以抗拒的魅 力。 三、CSS样式表在HTML中的实现 在HTML网页中加入CSS并不是只有一种方法，在不同的情况 下，可以采用不同的方法，比较常用的有下面几中。 1．嵌入式样式表 嵌入式样式表的实现很简单，只需在每个要应用样式的HTML 标签后写上CSS属性即可。例如要设置指定表格中的文字的样式为红 色，字号为10pt，可在当前表格的table标记内添加下面的代码： table style=”color:red;font-size:10pt”。 这种方式主要用于对具体的标签作具体的调整，其作用的范围只 限于本标签。嵌入式样式表不能充分体现出CSS样式表的优越性，所 以应用场合并不多。 2．内联式样式表 若想只对当前页面应用样式，就要使用内联式样式表。所谓内联 式样式表就是把样式表定义语句放在标签style type=”text/css”和 /style中，设置时通常放在HTML代码的head部分。 3．外联式样式表 外联式样式表是将指定的样式代码放到一个扩展名为.css的样式 文件中以方便其他网页的调用。这种方式的优点是可以通过一个.css 文件管理网站中的多个网页。如果要对网站中其他页面进行样式引 用，可以先把样式用记事本定义成一个“.css”的文件。 例如：打开记事本，将定义的名为h3的样式代码写到记事本中， 保存的文件名为example.css，代码如下： h3{ font-family:”黑体”; color:green; font-style:italic; } 引用时在网页HTML代码的head标记后用link rel=” stylesheet” href=”example.css”引用这个样式文件，在body部分 的相应内容的前后加上h3和/h3。 四、CSS应用时应遵循的原则 1．使用CSS时标记不宜过多 在网站的开发过程中，有严密的CSS文档，一般不会经常去更 新。当网站需要修改或更新时，如果有大量的CSS存在，将会对修改 或更新工作形成一定的阻碍，不便于修改的顺利进行，导致制作者无 法对网站样式表结构有整体的把握。创建简洁的样式，将会对网站的 运行、更新提供便利。 2. 语义定义要明确、易懂 在选择恰当的、有意义的元素来表述的同时，还要确定选择class 和id属性值。定义明确可以让网站的维护变得简单，方便制作者的理 解。 3. 添加适当的注释和标签 添加适当的注释或标签，可以为自己或其他开发人员留下提示信 息以避免后期引起的不必要的困惑和麻烦。最常见的是为CSS样式规 则添加提示信息，不过使用注释对优化组织结构和提升效用也很有帮 助。这种应用简洁性最为重要。 4. 在网