文章教程

11.1初识CSS

8/31/2020 9:52:39 PM 人评论 次浏览

11.1 初识CSS

引入CSS是因为在HTML中,虽然有<b>、<u>、<i>和<p>等标签可以控制文本或图像等的显示效果,但这些标签的功能非常有限,而且有些特定的网站需求用这些标签是不能够完成的。

使用CSS可以将“网页结构代码”和“网页格式风格代码”分离开,从而使网页设计者可以对网页的布局进行更多的控制。利用样式表,可以将站点上的所有网页都指向某个(或某些)CSS文件,设计者只需要修改CSS文件中的某一行,整个网页上对应的样式都会随之发生改变。

CSS的作用可以概括为以下几点:

● 内容与表现分离。

● 表现的统一,可以使网页的表现非常统一,并且容易修改。

● 减少重复代码的编写。

● 增加网页的浏览速度。

● 减少硬盘容量。

11.1.1 CSS的发展历程

从上世纪90年代初,HTML被发明开始,样式就以各种形式出现了,不同的浏览器结合了它们各自的样式语言为用户提供页面效果的控制,此时的HTML版本只含有很少的显示属性。

随着HTML的成长,为了满足设计师的要求,HTML获得了很多显示功能。但是随着这些功能的增加,HTML代码开始变得越来越冗长和杂乱,于是CSS就随之出现了。

CSS的概念是在1994被提出的。其实,当时已经有过一些样式表语言的建议了,但CSS是第一个含有“层叠”概念的样式表语言。

1995年,当时W3C刚刚建立,它们对CSS的发展很感兴趣,为此组织了技术小组进行开发。1996年底,CSS初稿已经完成,同年,12月CSS规范的第1版本出版,即CSS 1。

1997年初,W3C内组织了专管CSS的技术小组,开始讨论第1版中没有涉及到的问题,其讨论结果促成了1998年5月出版CSS规范的第2版,即CSS 2。

CCS 3标准最早于1999年开始制订,并于2001年初提上W3C研究议程。在2011年6月7日,W3C发布了第一个CSS 3建议版本。CSS 3的重要变化是采用模块来增加扩展功能,目前CSS 3还在不断完善中。

11.1.2 CSS的特点

CSS是一组格式设置规则,用于控制Web页面的外观。通过使用CSS样式设置页面的格式,可将页面的内容与表现形式分离。页面内容存放在HTML文档中,而用于定义表现形式的CSS规则则存放在另一个文件中或HTML文档的某一部分,通常为文件头部分。将内容与表现形式分离,不仅可使维护站点的外观更加容易,而且还可以使HTML文档代码更加简练,缩短浏览器的加载时间。概括来说,CSS具有如下的特点:

(1)丰富的样式定义

CSS允许定义更为丰富的文档样式外观,CSS有设置文本属性及背景属性的能力,允许为任何元素创建边框并调整边框与文本之间的距离,允许改变文本的大小写、修饰方式(比如加粗、斜体等)、文本字符间隔、甚至隐藏文本以及其他的页面效果。

(2)易于使用和修改

CSS能够将样式定义代码集中于一个样式文件中,以实现某种页面效果,这样就不用将样式代码分散到整个页面文件代码中,从而方便管理。另外,还可以将几个CSS文档集中应用于一个页面,也可以将CSS样式表单独应用于某个元素,逐渐应用到整个页面。如果须要调整页面的样式外观,只需要修改CSS样式表的样式定义代码即可。

(3)多页面应用

不仅可以将多个CSS样式表应用于一个页面,也可以将一个CSS样式表应用于一个网站的多个页面。通过在各个页面中引用CSS样式表,可以保证网站风格及格式的统一。

(4)层叠

例如,一个CSS样式表定义了一个网站的10个页面的样式外观,但由于需求的变化,要求在保持外观的情况下对其中一个页面布局进行更改,此时可以应用CSS样式表的层叠特性。再创建一个只适用于该页面的CSS样式表,该样式表中包含修改的那一部分样式的定义代码,将两个不同的样式表同时应用到该页面,新的样式表中定义的样式规则将代替原来样式表定义的样式规则,而原来样式表中定义的其他外观样式(没有被改动过的)仍被应用。

(5)页面压缩

一个拥有精美页面的网站,往往需要大量或重复的表格和字型(Font)标记以形成各种规格的文字样式,这样做的后果是产生大量的标记从而使页面文件的大小增加。将用于描述页面的相似布局的代码形成块放到CSS样式表中,可以大大地减少页面文件的大小,这样在加载页面时,时间也会减少。

教程类别