css設置背景色和背景圖片
用css設置背景色和背景圖片：css
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
body{
background-color:blue;
background-p_w_picpath:url(F:\ss.jpg);
}
</style>
</head>
<body>
</body>
</html>
設置爲背景色是藍色，而後添加了一張背景圖，效果：html
默認背景圖鋪滿了整個頁面，那麼更改一下，讓圖片向X軸也就是水平方向平鋪過去咱們加一個屬性：ide
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
body{
background-color:blue;
background-p_w_picpath:url(F:\ss.jpg);
background-repeat:repeat-x;
}
</style>
</head>
<body>
</body>
</html>
出現的是這樣的一個效果：性能
那麼咱們要讓圖片縱向平鋪怎麼辦呢，直接將background-repeat:repeat-x;更改爲background-repeat:repeat-y;就能夠了，來看下效果：url
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
body{
background-color:blue;
background-p_w_picpath:url(F:\ss.jpg);
background-repeat:repeat-y;
}
</style>
</head>
<body>
</body>
</html>
那麼咱們不要讓圖片平鋪只要一張圖片怎麼辦呢，background-repeat:repeat-x;橫向平鋪background-repeat:repeat-y;縱向平鋪那麼不平鋪就是background-repeat:no-repeat;：htm
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
body{
background-color:blue;
background-p_w_picpath:url(F:\ss.jpg);
background-repeat:no-repeat;
}
</style>
</head>
<body>
</body>
</html>
效果：blog
再來看一個屬性background-p_w_upload:fixed;這個屬性能讓圖片固定住：圖片
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
body{
background-color:blue;
background-p_w_picpath:url(F:\ss.jpg);
background-repeat:no-repeat;
background-p_w_upload:fixed;
}
</style>
</head>
<body>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</body>
</html>
添加上屬性，再用<br />來讓頁面滾動條出現，這樣更能看出效果：utf-8
注意右側滾動條往下拉圖片仍是在左上角不動get