并且最寬值不大于1600px?
說真的啊,現(xiàn)在做響應(yīng)式設(shè)計,都不用你說這種限制分辨率的了。建議使用bootstrap框架來進(jìn)行專業(yè)的響應(yīng)式設(shè)計或在手機端采用百分比的設(shè)計更好適合響應(yīng)需求。這里青鋒建站先解決你的這個問題:
解決這個問題需要根據(jù)不同的分辨率來設(shè)置不同的寬度,先給<body class="my-width">body標(biāo)簽添加一個my-width類。然后針對這個類來設(shè)計樣式,在不同的分辨率下來規(guī)定這個寬度。具體代碼如下:
@media only screen and (min-width:1700px)//表示屏幕像素寬度大于1700PX時寬度為1600PX
{
.my-width {width:1600px;}
}
@media only screen and (max-width:1600px) and (min-width:1200px)//寬度在1200-1600之間是設(shè)置寬度為1180px
{
.my-width {width:1180px;}
}
@media only screen and (max-width:1200px) and (min-width:800px)//寬度在800-1200之間是設(shè)置寬度為800px
{
.my-width {width:800px;}
}
這里給你一個思路,可以再把寬度進(jìn)行細(xì)分,但是內(nèi)部的塊元素也需要在不同分辨率下添加自定義寬度,建議使用專業(yè)的響應(yīng)式設(shè)計框架或在PC端使用像素,在手機端平板使用百分比。如果覺得青鋒建站說得好,給個贊,順便關(guān)注一下。