前端 - 用@media設(shè)置html的font-size給rem用出現(xiàn)的問(wèn)題?
問(wèn)題描述
我的設(shè)計(jì)稿是640px的,所以設(shè)置font-size:62.5%比較寫值,但是屏幕縮小后的font-size比例我不知如何把控,不知這樣寫對(duì)不對(duì)?min-width: 580px和max-width:580px會(huì)不會(huì)沖突呢?
@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%; }}
問(wèn)題解答
回答1:會(huì)的,所以bootstrap 里都是差一個(gè)pixel. 產(chǎn)生沖突會(huì)怎樣呢?根據(jù)css的原理會(huì)選擇后定義的效果(選擇器權(quán)重相同的情況下)。那么這個(gè)沖突會(huì)發(fā)生在屏幕寬度580px的時(shí)候。在用戶使用的時(shí)候這種情況會(huì)很少見(jiàn)。但是并不是最佳實(shí)踐,因?yàn)槎噙M(jìn)行了一次額外渲染。
相關(guān)文章:
1. javascript - 在 vue里面用import引入js文件,結(jié)果為undefined2. php - 微信開(kāi)發(fā)驗(yàn)證服務(wù)器有效性3. javascript - 我的站點(diǎn)貌似被別人克隆了, google 搜索特定文章,除了域名不一樣,其他的都一樣,如何解決?4. javascript - js setTimeout在雙重for循環(huán)中如何使用?5. 求救一下,用新版的phpstudy,數(shù)據(jù)庫(kù)過(guò)段時(shí)間會(huì)消失是什么情況?6. 小程序怎么加外鏈,語(yǔ)句怎么寫!求救新手,開(kāi)文檔沒(méi)發(fā)現(xiàn)7. python沒(méi)入門,請(qǐng)教一個(gè)問(wèn)題8. html - 爬蟲(chóng)時(shí)出現(xiàn)“DNS lookup failed”,打開(kāi)網(wǎng)頁(yè)卻沒(méi)問(wèn)題,這是什么情況?9. java - idea創(chuàng)建多modules項(xiàng)目后,tomcat啟動(dòng)失敗10. php - mysql 模糊搜索問(wèn)題
