第5章 css样式的应用

《第5章 css样式的应用》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网站规划与网页设计理工部杨彩霖5.1CSS的特点和用途5.2CSS与HTML文档的结合方法5.3样式表语法5.4多重CSS的层叠5.5CSS的属性单位5.6CSS在网页中的应用第5章CSS样式的应用CSS（CascadingStyleSheets）中文翻译为层叠样式表单，简称样式表，是用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。样式就是格式，在网页中，文字的大小、色彩及图片位置等，都是设置显示内容的样式。层叠是指在HTML文档中引用多个定义样式的样式文件（CSS文件）时，若多个样式文件间所定义的样式发生冲突，将依据层次顺序处理。它的主要用

2、途如下所述。使页面的字体变得更漂亮，更容易编排，使页面效果真正达到赏心悦目。用户可以轻松地控制页面的整体风格和布局。如果站点上所有的页面都使用同一个CSS文件进行控制，那么可以对许多网页的风格格式同时进行更新，不用再一页一页地更新了。只要修改这个CSS文件中相应的代码，整个站点的所有页面都会随之发生变动。5.1CSS的特点和用途CSS控制网页内容显示格式的方式是通过许多定义好的样式属性（如字号、段落控制等）来实现的，并将多个样式属性定义为一组可供调用的选择符（selector）。其实，选择符就是某一个样式的名称。当HTML文档中某个元素要使用该样式时，必须使用

3、该名称选择样式。在这里使用选择符这个名词的原因，是为了与W3C标准统一，其实可以直接把它当成样式名称，这样会比较好理解。要想在浏览器中显示出样式表的效果，就要让浏览器识别并调用。当浏览器读取样式表时，要依照文本格式来读。这里介绍4种在页面中插入样式表的方法：内部样式、行内样式、链入外部样式和导入外部样式。5.2CSS与HTML文档的结合方法5.2.1内部样式内部样式（embeddedstyles）是把样式表放到页面的…区内，这些定义的样式就可以应用到页面中了。样式表是用标记对，在其中定义样式。其格式为：5.2.2行内样式行内样式（inlinestyles）也称内嵌样式，是指在HTML标记中插入style属性，再定义要显示的样式，而style属性的内容就是CSS的属性和值。用这种方法，可以很简单地对某个标记单独定义样式。它的特点是——“定

5、义某一个标记的样式风格”，即只对所定义的标记起作用，并非对整个页面起作用。有时候这种方式非常有效，其格式为：<标记style=“属性:属性值;属性:属性值…”>style属性可以应用于除basefont，param和script之外的任意标记（包括本身）。5.2.3链入外部样式链入外部样式（linkedstyles）就是当浏览器读取到HTML文档的样式表链接标记时，将向所链接的外部样式表索取样式。先将样式表保存为一个样式表文件（.css），然后在网页中用标记链接这个样式表文件，这个标记必须放到页面的…

6、ead>区内，其格式为：……rel="stylesheet"属性定义在网页中使用外部的样式表，type="text/css"属性定义文件的类型为样式表文本，href属性用于定义.css文件的URL。5.2.4导入外部样式导入外部样式（importedstyles）就是当浏览器读取HTML文件时，复制一份样式表到这个HTML文件中，即在内部样式表的导入外部样式表输入方式上更有优势，实质上它相当于内部样式。5.3.1用类（class）选择符定义样式用类选择符能够把相同的标记分类定义为不同的样式。例如，希望同一种标记（如

）在不同的地方使用不同的样式（一个段落向右对齐，一个段落居中），就可以先定义两个类，在应用时只要在标记中指定它属于哪一个类，就可以使用该类的样式了。其格式为：