css样式教程---css控制背景图片-背景相关的css

最近做网站的时候,感觉css使用并不是那么轻松,于是从网上找了点教程看看,感觉还是挺重要的,一个好的CSS代码,只要你熟悉了,以后拿过来之间套上就行了, 真是方面,但是看的那CSS代码总叫人感觉头大,好好看看,最基础的教程吧,至少可以让你轻松一下,吻过而知心(温故而知新)

背景相关的css－－－－css控制背景图片+鼠标指向背景改变颜色

背景颜色 background-color

·背景图片 background-image

·图片是否重复显示 background-repeat

　　bcackground-repeat后面加上repeat-x（水平方向铺开）、repeat-y（垂直方向铺开）、repeat（两个方向铺开）。当然，它可以控制图片的重复，也可以控制图片不重复的。no-repeat这个就是用来表示只显示一幅背景图片，而不是重复出现的，这个可不是默认的哟，默认的是重复显示背景图片（repeat）。

·定位图片显示位置 background-position

　　它就是用来显示图片相对于左上角的一个位置的（就是默认的值0% 0%），由两个值来设定，中间用空格来隔开。

·控制图片是否滚动 background-attachment

　　scroll（静止）和fixed（滚动）

实例方法如下：

body{background-color:yellow}

H1{background-color:#000000}

body{background-image:url(BACKGRND.GIF)}

h1{background-image:url(none)}

body{background-image:url(BACKGRND.GIF);background-repeat:no-repeat}

body{background-image:url(BACKGRND.GIF);background-repeat:no-repeat;background-position:100px 10px}

body{background-image:url(BACKGRND.GIF);background-repeat:no-repeat;background-attachment:fixed}

body{background:green url(BACKGRND.GIF) fixed 100px 50px no-repeat}

<table width="285" cellpadding="0" cellspacing="0" background="images/video_bg.jpg" bgcolor="#FFFFFF" style=" background-repeat:repeat-x; background-position:top ">

鼠标指向背景改变颜色

表格中：<td bgcolor="#eeeeee" onMouseOver="this.bgColor='#ffffff';" onMouseOut="this.bgColor='#eeeeee';"><a href="default.asp">网站首页</a></td>

DIV中：<div onmouseover="this.id='bbb';" onmouseout="this.id='aaa';" id="aaa"><br />test<br /></div>