站長資訊網(wǎng)
最全最豐富的資訊網(wǎng)站

css怎么設(shè)置背景圖大小

css中可使用background-size屬性來設(shè)置背景圖大小,語法“background-size:數(shù)值|百分比|cover|contain;”;其中cover代表等比擴展圖片來填滿元素,contain代表等比縮小圖片來適應(yīng)元素的尺寸。

css怎么設(shè)置背景圖大小

本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

css3設(shè)置背景圖片的大小

<!DOCTYPE html> <html> <head> <meta charset="utf-8">  <style>  body { 	background:url(img_flwr.gif); 	background-size:80px 60px; 	background-repeat:no-repeat; 	padding-top:40px; } </style> </head> <body> <p> Lorem ipsum,中文又稱“亂數(shù)假文”, 是指一篇常用于排版設(shè)計領(lǐng)域的拉丁文文章 ,主要的目的為測試文章或文字在不同字型、版型下看起來的效果。 </p>  <p>原始圖片: <img src="/try/demo_source/img_flwr.gif"  alt="Flowers" width="224" height="162"></p>  </body> </html>

css怎么設(shè)置背景圖大小

css3 background-size 屬性

background-size屬性指定背景圖片大小;在firefox,chrome,以及ie9上都可以使用。

具體使用方法如下:

  • 背景圖尺寸(數(shù)值表示方式):

#background-size{  background-size:200px 100px;  }
  • 背景圖尺寸(百分比表示方式):

#background-size2{  background-size:30% 60%;  }
  • 背景圖尺寸(等比擴展圖片來填滿元素,即cover值):

#background-size3{  background-size:cover;  }
  • 背景圖尺寸(等比縮小圖片來適應(yīng)元素的尺寸,即contain值):

#background-size4{  background-size:contain;  }
  • 背景圖尺寸(以圖片自身大小來填充元素,即auto值):

#background-size5{  background-size:auto;  }

(學(xué)習(xí)視頻分享:css視頻教程)

贊(0)
分享到: 更多 (0)
網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號
亚洲国产成人精品不卡青青草原 | 日韩视频一区二区| 亚洲精品色播一区二区| 亚洲国产精品久久网午夜| 人妻少妇精品中文字幕av蜜桃| 黑人精品videos亚洲人| 成人区人妻精品一区二区不卡视频 | 亚洲国产精品成人久久| 中文字幕在线亚洲精品| 久久久精品人妻无码专区不卡| 国产成人精品久久一区二区三区av| 日韩在线一区视频| 亚洲日韩中文字幕在线播放| 国产精品jizzjizz| 在线观看国产精品va| 东京热一精品无码AV| 精品少妇人妻AV一区二区| 亚洲精品国产高清在线观看| 日韩国产精品视频| 久久只有这精品99| 一本色道久久综合亚洲精品蜜桃冫 | 精品国产一区二区三区不卡| 91嫩草亚洲精品| 国产精品国产精品国产专区不卡| 亚洲偷自精品三十六区| 四虎国产精品永久在线播放| 国产精品大bbwbbwbbw| 中文精品一卡2卡3卡4卡| 日韩精品一线二线三线优势| 国精品产区WNW2544| 精品伊人久久大线蕉地址| 国产成品精品午夜视频| 日韩一区二区三区无码影院| 日韩电影中文字幕在线观看| 四虎永久在线精品免费一区二区| 亚洲精品国产精品国自产观看| 国产成人久久精品麻豆一区| 久久精品免费网站网| 91精品国产色综合久久| 久久精品国产精品| 久久国产亚洲精品无码|