CSS代码示例.doc

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN /TR/xhtml1/DTD/xhtml1-transitional.dtd html head titleCSS样式/title /head body pfont color=#FF0000style样式写在head与/head之间/font/p 1.内嵌样式： P style=font-size:20pt; color:red这个内嵌样式(Inline Style)定义段落里面的文字是20pt字体，字体颜色是红色。/p P这段文字没有使用内嵌样式。/p 2.内部样式表： HEAD STYLE type=text/css H1.mylayout {border-width: 1; border: solid; text-align: center;color:red} /STYLE /HEAD BODY H1 class=mylayout 这个标题使用了Style。/H1 H1这个标题没有使用Style。/H1 /BODY 3.外部样式表： HEAD link href=/css/home.css rel=stylesheet type=text/css /HEAD BODY H1 class=mylayout 这个标题使用了Style。/H1 H1这个标题没有使用Style。/H1 /BODY 4.通用样式表： HEAD TITLEGeneric Class Selector /title STYLE TYPE=text/css .center {text-align:center} /STYLE /HEAD h1 class = center这个标题居中显示。/h1 p class = center这个段落居中显示。/p /BODY 5.Tag样式： HEAD TITLEClass Selector/title STYLE TYPE=text/css p.right {text-align:right} p.center {text-align:center} /STYLE /HEAD p class=center这一段居中显示。/p p class=right这一段是居右显示。/p /BODY /body /html 6.内嵌于其他Tag的样式： head titleClass Selector/title style TYPE=text/css p em {color:red} /style /head p这个段落中用em强调的字是em红色/em的。/p h3这个标题中用em强调的字em不是红色/em的。/h3 /body 7.背景颜色属性： head title背景颜色 background-color/title style type=text/css body {background-color:#99FF00;} /style /head body p这个HTML使用了CSS的background-color属性，将HTML的背景颜色变成翠绿色。p /body 8.背景图片属性： headtitle背景图片background-image/title/head body style=background-image:url(aa.jpg) p这个HTML使用了CSS的background-image属性，设置了背景图片。p /body 9.背景附着属性： style type=text/css body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:no-repeat; background-attachment:fixed} /style 10.背景位置属性： style type=text/css body {background-image:url(../images/css_tutorials/background.jpg);background-repeat:no-repeat; background-position:20px 60px} /style /head body p这个HTML使用了CSS的background-position属性。这个属性和background-image属性连在一起使用，决定了背景图片的最初位置。/p p上面的代码表示背景图片的初始位置距离网页最左面20px，距离网页最上面60px。/p /body 11.背景属性: html head title背景属性