3.5背景图像固定（背景附着）
生活随笔
收集整理的這篇文章主要介紹了
3.5背景图像固定（背景附着）
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
提示：background-attachment屬性設置背景圖像是否固定或者隨著頁面其余部分滾動、兩屬性值，scroll圖片跟著內(nèi)容一起滾動、fixed圖片固定內(nèi)容滾動。
1、語法：
? ? ? ? ? ? ? ?div{
? ? ? ? ? ? ? ? ? ? ? ?background-attachment：scroll；
? ? ? ? ? ? ? ? ? ? }
解釋：
scroll? ? ? ? ? ?背景圖片跟隨對象內(nèi)容滾動
fixed? ? ? ? ? ? 背景圖像固定
自己代碼展示：
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>背景圖像固定</title><style>body {background-image: url(wzbj.jpg);/* 這個表示圖片背景 */background-repeat: no-repeat;/* 這個表示平鋪背景 */background-position: center top;/* 這個表示圖片位置：屬性值用是方向、還有兩不一樣的屬性值一個是精準位置、另一個是混合位置 *//* background-attachment: scroll; *//* 這個表示“background-attachment”表示圖片附著背景兩屬性值：第一個是：scroll表示背景跟內(nèi)容一起滾動另一個是:fixed 表示背景固定內(nèi)容在滾動 */background-attachment: fixed;color: azure;font-size: 20px;}</style> </head><body><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p><p>你好呀！小豬佩奇</p></body></html>結果顯示：
總結
提示：這里對文章進行總結：
例如：以上就是今天要講的內(nèi)容，本文僅僅簡單介紹了background-attachment屬性設置背景圖像是否固定或者隨著頁面其余部分滾動、兩屬性值，scroll圖片跟著內(nèi)容一起滾動、fixed圖片固定內(nèi)容滾動。
總結
以上是生活随笔為你收集整理的3.5背景图像固定（背景附着）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 前端html生成图片,HTML5 Can
- 下一篇： ppt 电子计算机的故事,《计算机之父的