前端 - 用@media設(shè)置html的font-size給rem用出現(xiàn)的問題?
問題描述
我的設(shè)計稿是640px的,所以設(shè)置font-size:62.5%比較寫值,但是屏幕縮小后的font-size比例我不知如何把控,不知這樣寫對不對?min-width: 580px和max-width:580px會不會沖突呢?
@media only screen and (min-width: 640px){ html{font-size: 62.5%; }}@media only screen and (max-width: 640px) and (min-width: 580px){ html{font-size: 62.5%; }}@media only screen and (max-width:580px) and (min-width: 440px){ html{font-size: 54%; }}@media only screen and (max-width:440px) and (min-width: 400px){ html{font-size: 46%; }}@media only screen and (max-width:440px) and (min-width: 400px){ html{font-size: 42%; }}@media only screen and (max-width:400px) and (min-width: 360px){ html{font-size: 40%; }}@media only screen and (max-width:400px) and (min-width: 360px){ html{font-size: 32%; }}
問題解答
回答1:會的,所以bootstrap 里都是差一個pixel. 產(chǎn)生沖突會怎樣呢?根據(jù)css的原理會選擇后定義的效果(選擇器權(quán)重相同的情況下)。那么這個沖突會發(fā)生在屏幕寬度580px的時候。在用戶使用的時候這種情況會很少見。但是并不是最佳實踐,因為多進行了一次額外渲染。
相關(guān)文章:
1. android - NavigationView 的側(cè)滑菜單中如何保存新增項(通過程序添加)2. python - 管道符和ssh傳文件3. 老師 我是一個沒有學過php語言的準畢業(yè)生 我希望您能幫我一下4. python - Pycharm一句代碼寫完可以自動補全空格么?5. 這段代碼既不提示錯誤也看不到結(jié)果,請老師明示錯在哪里,謝謝!6. 提示語法錯誤語法錯誤: unexpected ’abstract’ (T_ABSTRACT)7. tp5 不同控制器中的變量調(diào)用問題8. 微信開放平臺 - android 微信支付后點完成按鈕,后回調(diào)打開第三方頁面,屏幕閃動,求解決方法9. mysql服務(wù)無法啟動1067錯誤,誰知道正確的解決方法?10. php7.3.4中怎么開啟pdo驅(qū)動
