CSS是Cascading Stylesheets的简称,译为中文层叠样式表。它是一种制作网页的新技术,是网页设计必不可少的工具之一。W3C(The World Wide Web Consortium)把动态HTML(Dynamic HTML)分为三个部分来实现:脚本语言(包括JavaScript、Vbscript等)、支持动态效果的浏览器(包括Internet Explorer、Netscape Navigator等)和CSS样式表。可见,CSS重要性十分突出。
二、CSS的特性
其一,CSS样式表文件将网页的样式代码简化了,外部的样式表会被浏览器保存在缓存里,加快了页面下载速度,提高了页面浏览速度。
其二,CSS样式表文件控制着整个网站的格调,修改其参数可以使网站所有页面同时被更新,提升了修改工作效率,减轻了重复劳动强度。
三、CSS的添加
添加方法主要有四种:
1、添加在HTML的标识符<Tag>中:
<Tag style=”properties”>网页内容</tag>
举例:<p style=”color: #ff0000; font-size:10pt”>徐果萍博客</p>
徐果萍博客
代码说明:用红色显示字体大小为10pt有“徐果萍博客”,但此方法不经常使用。
2、添加在HTML的头信息标识符< head>中:
< head> < style type=”text/css”>
< !– 样式表的具体内容 –> < /style> < /head>
代码说明:type=”text/css”,帮助不支持CSS的浏览器过滤掉CSS代码,避免在浏览器面前直接以源代码的方式显示我们设置的样式表。同时应该学会在样式表里加上注释标识符“< !–注释内容–>”。
3、添加在HTML的头信息标识符< head>中,链接样式表:
< head>
< link rel=”stylesheet” href=”*.css” mce_href=”*.css” type=”text/css” media=”screen”>
< /head>
*.css是单独保存的样式表文件,其中不能包含< style>标识符,并且只能以css为后缀。Media是可选的属性,表示使用样式表的网页将用什么媒体输出。取值范围:
·Screen(默认):输出到电脑屏幕 ·Print:输出到打印机 ·TV:输出到电视机
·Projection:输出到投影仪 ·Aural:输出到扬声器 ·Tty:输出到电传打字机
·Braille:输出到凸字触觉感知设备 ·All:输出到以上所有设备
如果要输出到多种媒体,用逗号分隔取值表。
Rel属性表示样式表将以何种方式与HTML文档结合。取值范围:
·Stylesheet:指定一个外部的样式表
·Alternate stylesheet:指定使用一个交互样式表
4、添加在HTML的头信息标识符< head>中,联合使用样式表:
< head> < style type=”text/css”>
< !–@import ”*.css” 其他样式表的声明–> < /style> < /head>
以@import开头的联合样式表输入方法和链接样式表的方法相似,联合法可在链接外部样式表,根据该网页具体情况,做出别的网页不需要的样式规则。
注意点:
·联合法输入样式表必须以@import开头。
·如同时输入多个样式表有冲突的时候,按照第一个输入的样式表对网页排版。
·如果输入的样式表和网页里的样式规则冲突时,使用外部的样式表。
第一课时内容结束!
