一，效果圖。html
二，代碼。post
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS backgrounds</title> <style> h1 { background-color: #6495ed; } p { background-color: #e0ffff; } div { background-color: #b0c4de; } body { background-image: url('paper.gif'); background-color: #cccccc; background-repeat: no-repeat; background-position: right top; margin-right: 200px; } body { background: #ffffff url("img_tree.png") no-repeat right top; margin-right: 200px; } </style> </head> <body> <h1>CSS background-color實例!</h1> <div>改文本插入在div元素中.</div> <p>該段落有本身的背景顏色</p> <p>背景圖片不重複，設置position實例</p> <p>背景圖片只顯示一次，並與文本分開</p> <p>實例中還添加了margin-right屬性用於讓圖片與文本間隔開</p> </body> </html>
參考資料：《菜鳥教程》url