书山有径勤为路>>>>>>>>

<<<<<<<<学海无涯苦作舟!

CSS设置背景——颜色背景

<1>.设置body的背景颜色

 1 <html>
2 <head>
3 <style type="text/css">
4 body {background-color: yellow}
5 h1 {background-color: #00ff00}
6 h2 {background-color: transparent}
7 p {background-color: rgb(250,0,255)}
8 p.no2 {background-color: gray; padding: 20px;}
9 </style>
10 </head>
11
12 <body>
13 <h1>这是标题 1</h1>
14 <h2>这是标题 2</h2>
15 <p>这是段落</p>
16 <p class="no2">这个段落设置了内边距。</p>
17 </body>
18 </html>

上面的代码中<style> </style>是用来设置css属性的。

看了下面的这个图你就会一切都明白了。

CSS 语法

多个选择器属性要用分号隔开。

具体的效果如何,那就得动手了!


<2>.设置部分字体的颜色

 1 <html>
2
<head>
3
<style type="text/css">
4 span.highlight
5
{
6 background-color
: yellow
7
}
8
</style>
9
</head>
10
11
<body>
12
<p>
13
<span class="highlight">通过 CSS 继承,</span>
14 子元素将继承最高级元素(在本例中是 body)所拥有的属性
15
<span class="highlight">
16 (这些子元素诸如 p, td, ul, ol, ul, li, dl, dt,和 dd)。
17
</span>
18 不需要另外的规则,所有 body 的子元素都应该显示
19 Verdana字体,子元素的子元素也一样。
20 并且在大部分的现代浏览器中,也确实是这样的。
21
</p>
22
</body>
23
</html>

我们将看到在<span> </span>标签中的字体的背景颜色就成了黄色的了。

<span>标签是什么呢?

根据我的体会:它的作用就是把一段话分开成不同的部分,以便于添加不同的样式。

具体的效果如何,那就要自己动手啦!




posted on 2011-09-13 21:51  More study needed.  阅读(501)  评论(0编辑  收藏  举报

导航

书山有径勤为路>>>>>>>>

<<<<<<<<学海无涯苦作舟!