網(wǎng)頁(yè)中的圖片高度（不能被壓縮拉伸）自適應(yīng)瀏覽器窗口高度，寬度相應(yīng)的進(jìn)行兩邊裁剪，請(qǐng)這個(gè)效果怎么寫(xiě)？
慕田峪8701529
2017-07-31 10:42:27
3 回答
業(yè)余奶茶品鑒師
TA貢獻(xiàn)260條經(jīng)驗(yàn) 獲得超388個(gè)贊
背景圖片 no-reapt center top，用js 獲取屏幕高度，賦給這個(gè)di，就可以了
WingMeng
TA貢獻(xiàn)32條經(jīng)驗(yàn) 獲得超13個(gè)贊
補(bǔ)充一種方法：
<div?class="box"> </div>
然后 CSS 部分：
.box?{
????line-height:?1;
????font-size:?10em;??/*?圖片高度?*/
????border:?1px?solid?#ccc;
????background:?url(xxx.jpg)?center?no-repeat;??/*?圖片?*/
}
一諾yinol
TA貢獻(xiàn)27條經(jīng)驗(yàn) 獲得超4個(gè)贊
直接同css寫(xiě)就行了，
? ?width:?100%;
? ?padding-top:?14%; ?/* 寬除以高的比例 */
? ?height:?0;
? ?position:?relative;
? ?background:?url(img/**.jpg) no-repeat center center;
? ?background-size:?100%;
添加回答
舉報(bào)
0/150
提交
取消