前端 - 用@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的時候。在用戶使用的時候這種情況會很少見。但是并不是最佳實踐,因為多進(jìn)行了一次額外渲染。
相關(guān)文章:
1. docker start -a dockername 老是卡住,什么情況?2. docker images顯示的鏡像過多,狗眼被亮瞎了,怎么辦?3. docker gitlab 如何git clone?4. dockerfile - [docker build image失敗- npm install]5. docker不顯示端口映射呢?6. docker-compose 為何找不到配置文件?7. java - jwt token安全性問題.8. node.js - 如何用express設(shè)置微信小程序的本地后臺服務(wù)器?9. javascript - html 中select如何修改樣式,鼠標(biāo)懸浮時改變option樣式,有沒有插件啊10. javascript - js 多維數(shù)組的問題
