CSS教程(基础)

《CSS教程(基础)》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、第一章CSS层叠样式表（基础篇）css,就是“层叠样式表”。将CSS引入到网页中是网页编辑的一大革命吧~通过设置CSS,我们可以随意地控制网页中字体的大小、颜色等，便于统一网站的整体风格；可以方便地为网页中的各个元素设置背景颜色和图片并进行精确的定位控制；可以为网页中的元素设置各种滤镜，从而产生诸如阴影、辉光、模糊等只有在图彖处理软件屮才能实现的效果；可以与脚本语言相结核，在网页屮实现很多动态滤镜效果。下而我们就来详细说明CSS的语法和在网页屮的编辑。由于这篇内容较多，就分为两篇讲解。本篇的主要内容是：oCSS的语法b如何将CSS添加到页面中D用DW的CSS

2、编辑器编辑css文件dCSS的语法在使用CSS前，我们先要对CSS的基本语法有所了解。如果你安装了Frontpage,不妨用*・css搜索一下你的硬盘,你会找到很多CSS文件。这都是FP自带的模板的CSS。伤〈可以打开其屮一个研究一下~用。用和FP都能打开css文件，当然最简单的还是用记事本打开。下面我们来看一段CSS代码：p{font-family:〃宋体〃；font-size:12px;line-height:12pt;color:#000000}td{font-family:"宋体"；font-size:12px;color:#000000}a:lin

3、k{color:#00OOFF;text-decoration:nonc}a:visitcd{color:#666666;text-decoration:nonc}a:active{color:green;text-decoration:none;}a:hover{color:#FF0000;background-color:#ff9900;text-decoration:underline}第一行和第二行的P、td标签，分别定义了网页中文字和表格中文字的字体、大小和颜色。由于网页屮的文字基本上都放置在表格屮，所以需要定义表格屮的文字属性。font-fami

4、ly:宋体〃指定网页屮的字体。font-size:12px制定字体的大小。可以用12px或者是9pt。这两种字体大小在800和1024的分辨率下都比较好看。line-height:12pt行与行Z间的距离。color:#000000——字体的颜色。#000000表示的是黑色。在网页编辑中，颜色是用I•六进制数来表示的。你也可以用颜色的英文名称来表示，如红色的代码写成#ffOOOO,也可以写成red。第三行——第六行的a标签，指定的是链接文本的变化控制。link表示超链接的文本在链接未被访问时的颜色，代码中指定颜色为0OOOffC蓝色)。visited表示链接

5、被访问过后的颜色为灰色(#666666)。active表示鼠标点击链接时链接的文本颜色为绿色。hover表示鼠标抬向链接但未点击时的链接颜色为红色，背景颜色为橙色。text-decoration:none表示链接文本没有下划线。text-decoration:underline则表示链接文本有下划线。请大家仔细看这段代码，在下面的教程中，我们都将以这段代码作为例子。D如何将CSS添加到页面屮在讲解如何编辑CSS前，我们先來说一下怎么把CSS添加到页面中，即怎么才能止编辑好的css对页面元索起作用呢？一般來说，有两种方法。一种方法是直接把CSS代码粘贴到htm

6、l中。比如我们把下面一段代码粘贴入HTML代码的之间就可以了。〈!—p{font-fam订y:"宋体〃；font-size:12px;line-height:12pt;color:#000000}Id{font-family:〃宋体"；font-size:12px;color:#000000}a:link{color:ttOOOOFF;text-decoration:none}a:visited{color:#666666;text-decoration:none}a:active{col

7、or:green;text-decoration:none;}a:hover{color:#FF0000;background-co1or:#ff9900;text-decoration:underline}—>不过这样做，我们只是定义了这个页面的css。如果一个网站有很多页面的话，一个一个页面粘贴代码是不人可能的。所以我还是建议人家用第二种办法〜第二种办法就是将css代码生成一个*•css的文件，然后将这个文件链接到所需的页面上。这样做一个很大的好处就是，你可以把网站上所有页面都链接到一个css文件，一-日.这个CSS文件修改，那么所有的页

8、面风格也随Z改变。这就是css的好处Z—。在DW里，