CSS3中background-size的問題
問題描述
cover 此時會保持圖像的縱橫比并將圖像縮放成將完全覆蓋背景定位區(qū)域的最小大小。contain 此時會保持圖像的縱橫比并將圖像縮放成將適合背景定位區(qū)域的最大大小。
這里面說的最大大小和最小大小該怎么理解呢?為什么我覺得它們好像沒有區(qū)別啊?
問題解答
回答1:寫一段代碼自己驗證一下啊:
<!DOCTYPE html><html><head><style> p {width: 200px;height: 200px;}.contain{border: black 1px solid;background:url(/i/bg_flower.gif);background-size:contain;background-repeat:no-repeat;padding:10px;}.cover{border: red 1px solid;background:url(/i/bg_flower.gif);background-size:cover;background-repeat:no-repeat;padding:10px;}</style></head><body><p>contain</p><p class='contain'></p><p>cover</p><p class='cover'></p><p>原始圖片<img src='http://www.b3g6.com/i/bg_flower.gif'/></p></body></html>
可以看出,盡管cover和contain都保持了縱橫比,但是contain會把圖片完全包含進(jìn)box,box內(nèi)部有些部分沒有圖片:
而cover則是圖片會完全覆蓋box,而圖片的有些部分則會不顯示:
http://segmentfault.com/a/1190000002481921#articleHeader8
據(jù)說這里有答案……
相關(guān)文章:
1. debian - docker依賴的aufs-tools源碼哪里可以找到啊?2. dockerfile - 我用docker build的時候出現(xiàn)下邊問題 麻煩幫我看一下3. docker網(wǎng)絡(luò)端口映射,沒有方便點的操作方法么?4. docker-compose 為何找不到配置文件?5. macos - mac下docker如何設(shè)置代理6. docker start -a dockername 老是卡住,什么情況?7. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣?這個是怎么回事????8. 如何解決Centos下Docker服務(wù)啟動無響應(yīng),且輸入docker命令無響應(yīng)?9. angular.js使用$resource服務(wù)把數(shù)據(jù)存入mongodb的問題。10. docker gitlab 如何git clone?

網(wǎng)公網(wǎng)安備