HTML CSS 背景图居中属性background-position
生活随笔
收集整理的這篇文章主要介紹了
HTML CSS 背景图居中属性background-position
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
HTML CSS背景圖居中(無序列表)
--背景重復(fù):backgroung-repeat:--no-pepeat:不重復(fù)--repeat-x:水平水平方向平鋪; --repeat-y:垂直方向平鋪--背景位置:background-position(x,y):--屬性值分水平和垂直方向:-- 水平方向: left/center/ight;-- 垂直方向: top/center/bottom :--background-position:right;表示圖片右居中,兩個(gè)屬性當(dāng)只設(shè)置一個(gè)時(shí),另外一個(gè)默認(rèn)為center--背景大小設(shè)置: background-size--按高度等比縮放: contain--按寬度等比縮放: cover完全按照容器大小進(jìn)行100%縮放: background-size:100% 100%; <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>漸變背景</title><style>ul {width: 260px;list-styLe: none;padding: 0 40px 0 0;/* border: 1px solid red; */}li {width: 300px;height: 40px;border: 1px solid red;background: url("imgurl");background-repeat: no-repeat;background-position: right;}/* --背景重復(fù):backgroung-repeat:--no-pepeat:不重復(fù)--repeat-x:水平水平方向平鋪; --repeat-y:垂直方向平鋪--背景位置:background-position(x,y):--屬性值分水平和垂直方向:-- 水平方向: left/center/ight;-- 垂直方向: top/center/bottom :--background-position:right;表示圖片右居中,兩個(gè)屬性當(dāng)只設(shè)置一個(gè)時(shí),另外一個(gè)默認(rèn)為center--背景大小設(shè)置: background-size--按高度等比縮放: contain--按寬度等比縮放: cover完全按照容器大小進(jìn)行100%縮放: background-size:100% 100%;*/</style> </head><body><div><ul><li>第三年初</li><li>奪萃比無無無無</li><li>而紛紛發(fā)文</li></ul></div> </body> </html>背景圖居中屬性background-position
總結(jié)
以上是生活随笔為你收集整理的HTML CSS 背景图居中属性background-position的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 假如孔子看见《孔子》――兼谈我们需要怎样
- 下一篇: python秒表游戏代码_python编