如何通过CSS代码让背景定位

实例。我们知道真正的背景定位操作不是一步完成的，它必须与其它的代码一起操作。比如背景图像的指定，背景重复方式的指定，背景的定位指定。

body  {   

 background-image:url('/i/3.gif');   

 background-repeat:no-repeat;   

 background-position:center; 

  }

定位关键字。既然这是一个定位，那么我们就可以选择一些关键字来实现。

top/left/right 等等关键字都是这样的一个语句。

p  {   

 background-image:url('g.gif');  

  background-repeat:no-repeat;  

  background-position:top; 

  }

百分数值。在背景写信的代码当中，我们还有一种使用百分数的现象，这个百分数就是图像的中心点与元素的中心点相重合的意思。

body  {    background-image:url('/i/03.gif');    background-repeat:no-repeat;    background-position:50% 50%;  }

长度值。这个长度值也是一个定位常用的方式。它也是根据元素的方位来规定的。

body  {    background-image:url('/i/3.gif');    background-repeat:no-repeat;    background-position:50px 100px;  }

背景关联。在网页当中总会有各种的情况发生，文本超过图像的长度也是经常会有的，这个时候，我们定义一个图像不随文本而滚动，这个情况就不会发生了。

 background-attachment 

这个例子当中，图像相对于窗口就锁定位置了。

body  {  background-image:url(/i/02.gif);  background-repeat:no-repeat;  background-attachment:fixed  }

设置文本的背景颜色属性的代码实例。我们让文本有了背景。

<style type="text/css">

span.highlight

{

background-color:yellow

}

</style>

<body>

<p>

<span class="highlight">这是文本。</span>