什么是CSS 及使用CSS的好处
CSS 是“cascading Style Sheet”的简称,中文翻译“串接样式表”,也被翻译为“层叠样式表”,是用于(增强)控制网页样式并能够将样式信息与网页内容分离的一种标记性语言。CSS 语言是一种标记语言,它不需要编译,可以直接由浏览器执行(属于浏览器解释型语言)。在制作网页的时候使用 CSS 可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。CSS 是由 W3C(W3C 就是 World Wide Web Consortium,全球万维网联盟的简称。W3C的主要职责就是确定未来万维网的发展方向,并且制定相关的推荐)的CSS 工作组产生和维护的。
CSS 最早被提议是在1994年,最早被浏览器支持是1996年。1996年 W3C 正式推出了CSS1. 1998年 W3C 正式推出了CSS2. CSS2.1 是 W3C 现在正在推荐使用的. CSS3 现在还处于开发中. CSS 3 在包含了所有 CSS 2 所支持的基础上更有所改进.
CSS 支持多种设备,例如手机、电视、打印机、幻灯片等。但是 CSS 在浏览器上得到了更好的推广。
和传统的 Html 相比 CSS 有以下优点:
- 强大的控制能力和排版能力:CSS 控制字体的能力比标记好多了,因此现在标记早已被 W3C 组织列为不被推荐使用的标记。
- 提高了网页的浏览速度: 使用 CSS 设计方法比传统的 Web 设计节省了50%到60%的文件尺寸。Table 标签是全部加载完才会显示出来,而 CSS
页面是加载一点显示一点也更好的提高了网页的浏览速度。以前非得通过图片转换实现的功能,现在只要用 CSS 就可以轻松实现, 改为从而能够更快地下载页面。
- 缩短修改时间提高工作量:传统的
Web 页面是需要修改每个<Font>及<Table>等标签,而利用 CSS 设计的 Web 页面只需要简单的修改几个 CSS 文件就可以重新设计整个站点。
- 更有利于搜索引擎的搜索:CSS 减少了代码量,使得正文更加突出,有利于搜索引擎的更有效的搜索到你的 Web 页面。
CSS 基本语法
CSS 基本语法结构:
Selector { property: value } Selector—选择符 property:value—样式表定义.属性和属性值之间用冒号(:)隔开.定义之间用分号(;)隔开,如果属性值为多个的时候则用双引号引起来。如果是指多个属性必须每个属性用分号隔开。也可以选择符组合,用逗号分割每个选择符,这样可以减少样式重复定义。
注释符:
你可以在CSS中插入注释来说明你代码的意思,注释有利于你或别人以后编辑和更改代码时理解代码的含义。在浏览器中,注释是不显示的。CSS注释以"/*" 开头,以"*/" 结尾,比如:/* 定义段落样式表 */
类选择符:
用类选择符你能够把相同的元素分类定义不同的样式,定义类选择符时,在自定类的名称前面加一个点号。假如你想要两个不同的段落,一个段落向右对齐,一个段落居中,你可以先定义两个类:然后用不在不同的段落里,只要在HTML标记里加入你定义的class参数:
类选择符还有一种用法,在选择符中省略 HTML 标记名,这样可以把几个不同的元素定义成相同的样式: .center {text-align: center}
(定义.center的类选择符为文字居中排列) 这样的类可以被应用到任何元素上。下面我们使 h1 元素(标题1)和 p 元素(段落)都归为“center”类,这使两个元素的样式都跟随“.center”这个类选择符:
ID 选择符:
在HTML页面中ID参数指定了某个单一元素,ID选择符是用来对这个单一元素定义单独的样式。 ID选择符的应用和类选择符类似,只要把CLASS换成ID即可。将上例中类用ID 替代:注意:ID 选择符局限性很大,只能单独定义某个元素的样式,一般只在特殊情况下使用。
注意:这种省略 HTML 标记的类选择符是我们今后最常用的 CSS 方法,使用这种方法,我们可以很方便的在任意元素上套用预先定义好的类样式。