今天一個(gè)朋友向織夢(mèng)無(wú)憂小編請(qǐng)教說(shuō),他公司網(wǎng)站圖片手機(jī)端不能自適應(yīng),很不美觀,叫小編幫忙看看。
經(jīng)過(guò)織夢(mèng)無(wú)憂小編研究發(fā)現(xiàn),問(wèn)題其實(shí)很簡(jiǎn)單。
找到對(duì)應(yīng)的CSS文件。將圖片的寬度屬性設(shè)為100%即可,至此問(wèn)題解決。
img {
border: 0;
width: 100%;【此為織夢(mèng)無(wú)憂小編多加的】
display: block;
}
這樣也有一個(gè)問(wèn)題,全部手機(jī)站里的圖片寬度都成width:100%了。
可以通過(guò)外圍div的class精確控制。
比如:
<div class='test'>
<img src='手機(jī)站展示的圖片路徑'/>
</div>
則可以這樣定義:
.test img{width: 100% !important; height:auto !important;}
上面的!important表示強(qiáng)調(diào)優(yōu)先級(jí)別。因?yàn)橛行﹫D片格式是自帶寬高限制的。
完美。。
版權(quán)聲明: 本站資源均來(lái)自互聯(lián)網(wǎng)或會(huì)員發(fā)布,如果侵犯了您的權(quán)益請(qǐng)與我們聯(lián)系,我們將在24小時(shí)內(nèi)刪除!謝謝!
轉(zhuǎn)載請(qǐng)注明: 手機(jī)端圖片不能自適應(yīng)解決方法