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

合集下载

相关主题

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

China Computer&Communication

随着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，可在当前表格的

标记内添加下面的代码：

。

这种方式主要用于对具体的标签作具体的调整，其作用的范围只

限于本标签。嵌入式样式表不能充分体现出CSS样式表的优越性，所以应用场合并不多。

2．内联式样式表

若想只对当前页面应用样式，就要使用内联式样式表。所谓内联

式样式表就是把样式表定义语句放在标签中，设置时通常放在HTML代码的部分。

3．外联式样式表

外联式样式表是将指定的样式代码放到一个扩展名为.css的样式

文件中以方便其他网页的调用。这种方式的优点是可以通过一个.css

文件管理网站中的多个网页。如果要对网站中其他页面进行样式引用，可以先把样式用记事本定义成一个“.css”的文件。

例如：打开记事本，将定义的名为h3的样式代码写到记事本中，

保存的文件名为example.css，代码如下：

h3{

font-family:”黑体”;

color:green;

font-style:italic;

}

引用时在网页HTML代码的标记后用

stylesheet”href=”example.css”>引用这个样式文件，在部分的相应内容的前后加上

和

。

四、CSS应用时应遵循的原则

1．使用CSS时标记不宜过多

在网站的开发过程中，有严密的CSS文档，一般不会经常去更

新。当网站需要修改或更新时，如果有大量的CSS存在，将会对修改或更新工作形成一定的阻碍，不便于修改的顺利进行，导致制作者无法对网站样式表结构有整体的把握。创建简洁的样式，将会对网站的运行、更新提供便利。

2. 语义定义要明确、易懂

在选择恰当的、有意义的元素来表述的同时，还要确定选择class

和id属性值。定义明确可以让网站的维护变得简单，方便制作者的理解。

3. 添加适当的注释和标签

添加适当的注释或标签，可以为自己或其他开发人员留下提示信

息以避免后期引起的不必要的困惑和麻烦。最常见的是为CSS样式规则添加提示信息，不过使用注释对优化组织结构和提升效用也很有帮助。这种应用简洁性最为重要。

4. 在网页中尽量使用CSS外联样式

在前面已经提到过外联式的使用方法，这种方法的优势就是可

以在不同的网页中调用，实现重复的使用。一个外部CSS文件，可以被多个页面共用的同时也便于修改。在网站网页制作过程中，要修改样式，只需要修改CSS文件，可以不用修改网页，既提高了工作的效率，也提高网页显示的速度。如果样式代码写在网页中，会影响到网页的整体运行。在网站的制作过程中，一定要最大限度地实现代码的运用，优化配置网站文件。

在网页制作过程中，还需要应用到其他与CSS密切相关的知识，

如HTML语言、Script脚本语言、DHTML语言等。相信结合CSS样式表不仅能够制作出整齐美观的网页，还能够给网页带来许多令人惊奇