01_04.background属性

来源：互联网发布：网页php前端网站编辑：程序博客网时间：2024/05/24 02:35

<!DOCTYPE HTML><html><head><meta http-equiv="content-type" content="text/html;charset=utf-8"><link rel="stylesheet" type="text/css" href="style/01_05_background.css"></head><body id="bg">1.默认背景<div id="moren"></div>2.默认背景水平重复<div id="chongfu_shuiping"></div>3.默认背景垂直重复<div id="chongfu_chuizhi"></div>4.默认背景不重复<div id="chongfu_buchongfu"></div><hr /><p>（tip：如果水平、垂直任意一项规定了值，另一项为居中）</p><hr />5.默认背景水平方向居左，垂直居下<div id="weizhi_shuiping_zuo_chuizhi_xia"></div>6.默认背景垂直方向居上，水平居右<div id="weizhi_chuizhi_shang_shuiping_you"></div>7.缩写<div id="suoxie"></div></body></html>

#bg{background: url(../images/01_05_background_body.jpg) top no-repeat #B0D76C fixed;}#moren{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);}#chongfu_shuiping{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);background-repeat: repeat-x;}#chongfu_chuizhi{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);background-repeat: repeat-y;}#chongfu_buchongfu{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);background-repeat: no-repeat;}#weizhi_shuiping_zuo_chuizhi_xia{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);background-repeat: no-repeat;background-position: left bottom;}#weizhi_chuizhi_shang_shuiping_you{width: 200px;height:200px;background-color:green;background-image: url(../images/01_05_background.png);background-repeat: no-repeat;background-position:  top right;}#suoxie{width: 200px;height:200px;background: red url(../images/01_05_background.png) no-repeat center;}

0 0