文章詳情頁
css3 - 圖片等比例縮放
瀏覽:139日期:2023-07-15 14:52:57
問題描述
要將千奇百怪(尺寸)的圖片放在一個固定寬高的p/a標簽中,如何保持圖片不變形以及能讓用戶看到關(guān)鍵信息(裁剪掉冗余部分),其實我個人想法是對上傳過來的圖片統(tǒng)一壓縮成我想要的尺寸,這個怎么實現(xiàn)?
問題解答
回答1:不確定你需要的關(guān)鍵信息是什么,但是如果這里的關(guān)鍵信息都包含了圖片的“中央”,那么居中顯示圖片即可,給固寬高的元素指定background。以下就是讓圖片等比居中布滿整個元素,多余的部分會被裁減:
.image-container { ... background-image: url(your/path/to/image.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; ...}回答2:
如果你圖片在一個p標簽里面,而這個p又設(shè)置好了高寬,可以通過設(shè)置圖片的background-size:100% 100%,來將圖片根據(jù)p的高寬實現(xiàn)自適應(yīng)……
標簽:
CSS
相關(guān)文章:
1. 數(shù)據(jù)庫 - Mysql的存儲過程真的是個坑!求助下面的存儲過程哪里錯啦,實在是找不到哪里的問題了。2. php傳對應(yīng)的id值為什么傳不了啊有木有大神會的看我下方截圖3. 如何用筆記本上的apache做微信開發(fā)的服務(wù)器4. python - linux怎么在每天的凌晨2點執(zhí)行一次這個log.py文件5. 關(guān)于mysql聯(lián)合查詢一對多的顯示結(jié)果問題6. 冒昧問一下,我這php代碼哪里出錯了???7. windows誤人子弟啊8. mysql優(yōu)化 - MySQL如何為配置表建立索引?9. MySQL主鍵沖突時的更新操作和替換操作在功能上有什么差別(如圖)10. 實現(xiàn)bing搜索工具urlAPI提交
排行榜

熱門標簽