第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

$fontSize為啥定義為37.5

老師,請(qǐng)問 global.scss 里面的那個(gè)$fontSize為啥定義為37.5哦?

正在回答

2 回答

你好,global.scss中設(shè)定了:

$ratio:?375?/?10;

@function?px2rem($px)?{
??@return?$px?/?$ratio?+?rem;
}

這里$ratio值的設(shè)定是由用戶決定的,可以根據(jù)自己的實(shí)際需要(或者UI設(shè)計(jì)稿)進(jìn)行修改

這個(gè)值決定了px2rem輸出的結(jié)果,如果設(shè)定為37.5,那么px2rem(20),表示在375px寬度的屏幕下,顯示為20px,計(jì)算方法如下:

第一步:375px寬度的屏幕,1rem=37.5px(因?yàn)樵贏pp.vue中指定了html的font-size=375px/10=37.5px,所以1rem=37.5px)

第二步:計(jì)算px2rem(20)=(20/37.5)rem

第三步:將rem轉(zhuǎn)化為px:(20/37.5) * 1rem = 20/37.5 * 37.5px = 20px

如果屏幕為414px,那么px2rem(20)的計(jì)算結(jié)果為:

px2rem(20)=(20/37.5)*41.4px=22.08px

從而實(shí)現(xiàn)了自適應(yīng)布局,因?yàn)閜x2rem(20)會(huì)隨屏幕寬度放大或縮小,這是一道數(shù)學(xué)題


直接輸出結(jié)論:

1、$ratio的值可以由用戶隨意設(shè)定

2、當(dāng)設(shè)置為37.5時(shí),表示以屏幕寬度375px為基準(zhǔn)

3、如果屏幕寬度大于375px,使用px2rem()方法計(jì)算出的值會(huì)等比例擴(kuò)大

4、如果屏幕寬度小于375px,使用px2rem()方法計(jì)算出的值會(huì)等比例縮小

8 回復(fù) 有任何疑惑可以回復(fù)我~
#1

慕仙6068316

我想請(qǐng)問的是為什么是加rem而不是乘
2019-06-12 回復(fù) 有任何疑惑可以回復(fù)我~
#2

Sam 回復(fù) 慕仙6068316

這里加號(hào)相當(dāng)于字符串拼接的含義
2019-06-13 回復(fù) 有任何疑惑可以回復(fù)我~
#3

剛仔

老師,這個(gè)20px,是設(shè)計(jì)稿中的像素嗎?還是設(shè)計(jì)稿中的像素是40px,我需要除以2,再利用這個(gè)公式自動(dòng)轉(zhuǎn)換?
2019-08-04 回復(fù) 有任何疑惑可以回復(fù)我~

3、如果屏幕寬度大于375px,使用px2rem()方法計(jì)算出的值會(huì)等比例擴(kuò)大

4、如果屏幕寬度小于375px,使用px2rem()方法計(jì)算出的值會(huì)等比例縮小

對(duì)于這兩點(diǎn)結(jié)論有個(gè)疑問,如果固定了基準(zhǔn)為$ratio 375 實(shí)際設(shè)計(jì)稿為上述兩種情況怎么做到自動(dòng)縮放,不是只能按照375的設(shè)計(jì)稿縮放嗎


0 回復(fù) 有任何疑惑可以回復(fù)我~

舉報(bào)

0/150
提交
取消

$fontSize為啥定義為37.5

我要回答 關(guān)注問題
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)