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

為了賬號安全,請及時綁定郵箱和手機立即綁定

$fontSize為啥定義為37.5

老師,請問 global.scss 里面的那個$fontSize為啥定義為37.5哦?

正在回答

2 回答

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

$ratio:?375?/?10;

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

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

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

第一步:375px寬度的屏幕,1rem=37.5px(因為在App.vue中指定了html的font-size=375px/10=37.5px,所以1rem=37.5px)

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

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

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

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

從而實現(xiàn)了自適應布局,因為px2rem(20)會隨屏幕寬度放大或縮小,這是一道數(shù)學題


直接輸出結(jié)論:

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

2、當設(shè)置為37.5時,表示以屏幕寬度375px為基準

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

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

8 回復 有任何疑惑可以回復我~
#1

慕仙6068316

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

Sam 回復 慕仙6068316

這里加號相當于字符串拼接的含義
2019-06-13 回復 有任何疑惑可以回復我~
#3

剛仔

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

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

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

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


0 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消

$fontSize為啥定義為37.5

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

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

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

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