最近做網站的時候,感覺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 οnmοuseοver="this.id='bbb';" οnmοuseοut="this.id='aaa';" id="aaa"><br />test<br /></div>

轉載于:https://www.cnblogs.com/9who/archive/2008/06/13/1218851.html

總結

以上是生活随笔為你收集整理的css样式教程---css控制背景图片-背景相关的css的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。