下面是一段比较典型的CSS代码 p{ font-family“宋体”; font-size9pt;line height: 12pt; color: #000000 td{ font-family“楷体GB2312”, font-size:20pt font-style: italic, font-weight: 800, text- decoration: blink color: #000000 a: hover(background-color: #ffccff; color: #ff6666 text-decoration: underline, float: left, a: link(color: #ff33ff, text-decoration: none) a: viSited color: #6600ff, text-decoration: none) a: active color green; text-decoration: none background-color: #ffccff, float: right
下面是一段比较典型的CSS代码： p{font-family:“宋体”; font-size:9pt; lineheight:12pt; color:#000000} td{font-family:“楷体＿GB2312”; font-size:20pt; font-style:italic;font-weight:800; textdecoration:blink;color:#000000} a:hover{background-color:#ffccff;color:#ff6666; text-decoration:underline; float:left} a:link{color:#ff33ff; text-decoration:none} a:visited{color:#6600ff; text-decoration:none} a:active{color:green; text-decoration:none; background-color:#ffccff; float:right}
这段代码共有6段,分别实现两种功能 前两行的格式分别为p{…}和td(……},作 用是对网页中文字的字体、大小、颜色等进行 置 后4行均是a命令词{…}的格式,是对超级 链接文本的控制。 下面分别解释这6段CSS代码: 1)、第一段p(……}中的【 font-family宋 体”】:指定网页文字的字体。【font size:9pt】:指定网页文字的字号的大小,pt是 表示文字大小的单位
这段代码共有6段，分别实现两种功能： ◼ 前两行的格式分别为p{……}和td{……}，作 用是对网页中文字的字体、大小、颜色等进行 设置。 ◼ 后4行均是a:命令词{……}的格式，是对超级 链接文本的控制。 下面分别解释这6段CSS代码： 1）、第一段p{……}中的【font-family:“宋 体” 】:指定网页文字的字体。【fontsize:9pt 】:指定网页文字的字号的大小，pt是 表示文字大小的单位
line-height:12pt】:指定行与行的垂直距离, color:#00000:指定网页的彦 0000表黑色,为十六进制数 第二段td{…}中的设置是对网页表格里的文 字进行控制 2)、链接文本的变化控制(例中的后4行) 第三段: a: hover{ background-color:#cf color: #ff6666: text-decoration: underline float!left}( hover表示鼠标指针指向链接文 字时,链接文字的背景颜色为#c,前景 颜色为#666,链接显示下划线,文字向 左浮动)
【line-height:12pt 】:指定行与行的垂直距离， 即行高。 【color:#000000 】:指定网页的颜 色，#000000代表黑色，为十六进制数。 第二段td{……}中的设置是对网页表格里的文 字进行控制。 2）、链接文本的变化控制（例中的后4行） 第三段：a:hover{background-color: #ffccff; color:#ff6666; text-decoration:underline; float:left}（hover表示鼠标指针指向链接文 字时，链接文字的背景颜色为#ffccff，前景 颜色为#ff6666，链接显示下划线，文字向 左浮动）
第四段:aink{colo:#3 ff text-decoration: none}(link表示链接未被访间时,链接颜色 为#33f,链接无下划线)。 第五段: a: visited{colo:#6600text decoration. none}( visited表示链接被访间后 链接的颜色为#6600,链接无下划线)。 第六段:a: active{ color green;text decoration: none; background-color: #ffccff float: right}( active表示鼠标点击链接时,链 接前景颜色为绿色,背景色为#c99,链接 无下划线,文字向右浮动)
第四段：a:link{color:#ff33ff; text-decoration: none }（link表示链接未被访问时，链接颜色 为#ff33ff，链接无下划线）。 第五段：a:visited{color:#6600ff; textdecoration:none}（visited表示链接被访问后， 链接的颜色为#6600ff，链接无下划线）。 第六段：a:active{color:green; textdecoration:none; background-color:#ffccff; float:right}（active表示鼠标点击链接时，链 接前景颜色为绿色，背景色为#ffcc99，链接 无下划线，文字向右浮动）
放置CSS代码 CSS样式代码写好后,它在ML中以stve 标记出现,它将如何放到HTML中呢 将CSS样式放入HTML中有2种方法: 1)、外部文件方式-将CSS代码写成一个 扩展名为“cs”的文件(可以用任何一个 文本编辑器中写,也可以用软件创建) 在HTML文档中加以引用,进行网页整 体风格的控制。 示入使用CSS外部文件的优点,可以在 每个HML文件中引用它,从而使整个 网页的风格能够保持一致
放置CSS代码 CSS样式代码写好后，它在HTML中以style 标记出现，它将如何放到HTML中呢？ 将CSS样式放入HTML中有2种方法： 1）、外部文件方式----将CSS代码写成一个 扩展名为“ .css ”的文件（可以用任何一个 文本编辑器中写，也可以用软件创建）， 在HTML文档中加以引用，进行网页整 体风格的控制。 提示：使用CSS外部文件的优点，可以在 每个HTML文件中引用它，从而使整个 网页的风格能够保持一致