rem px em的區(qū)別面試 移動端尺寸單位的區(qū)別:px,em和rem?
移動端尺寸單位的區(qū)別:px,em和rem?像素。相對長度單位。像素PX與顯示屏的分辨率有關(guān)。EM是相對長度的單位。相對于當前對象中文本的字體大小。如果未手動設(shè)置行內(nèi)文本的當前字體大小,則該字體大小與瀏
移動端尺寸單位的區(qū)別:px,em和rem?
像素。相對長度單位。像素PX與顯示屏的分辨率有關(guān)。EM是相對長度的單位。相對于當前對象中文本的字體大小。如果未手動設(shè)置行內(nèi)文本的當前字體大小,則該字體大小與瀏覽器的默認字體大小有關(guān)。任何瀏覽器的默認字體高度都是16px。所有未調(diào)整的瀏覽器都符合:1em=16px。然后12px=0.75em,10px=0.625em,為了簡化字體大小的轉(zhuǎn)換,需要在CSS的body selector中聲明font size=62.5%,使EM value變成16px*62.5%=10px,所以12px=1.2em,10px=1em,也就是說,只需要將原來的PX值除以10,然后用EM作為單位來替換。EM特征1。EM值不是固定的。EM繼承父元素的字體大小。因此,在編寫em時,我們需要注意兩點:1。在正文選擇器中聲明font size=62.5%;2。把你原來的PX值除以10,然后用em作為單位來代替;3。重新計算那些放大字體的EM值。避免重復(fù)聲明字體大小。Rem是CSS3中一個新的相對單位(根EM),引起了廣泛的關(guān)注。這個單位和他們有什么區(qū)別?區(qū)別在于,當rem用于設(shè)置元素的字體大小時,它仍然是相對大小,但相對大小只是HTML根元素。該裝置具有相對尺寸和絕對尺寸的優(yōu)點。它只需修改根元素就可以按比例調(diào)整所有字體大小,避免了字體大小層層復(fù)合的連鎖反應(yīng)。目前,除了IE8和早期版本,所有瀏覽器都支持rem.
前端開發(fā)中px,em,rem這些單位有哪些不同之處?
1。PX是一個固定的像素,不能適應(yīng)流的布局。通常,高度由Px設(shè)置,web應(yīng)用版本的寬度由rem.2設(shè)置。EM是相對于父元素的字體大小單位。因為它是相對于父元素的字體大小單位,所以如果要設(shè)置元素的寬度和高度,必須查看其父元素的大小。如果父對象也是EM單位,則必須轉(zhuǎn)到其父對象并逐層計算以獲得準確的像素值。
3. REM的出現(xiàn)改變了許多移動終端的適應(yīng)性,因為REM指的是相對于根元素的字體大小單位。只要HTML根上的字體大小是根據(jù)屏幕大小設(shè)置的,rem中的元素大小就會相應(yīng)地改變。
求余函數(shù)rem與mod的區(qū)別?
REM和mod只有一個區(qū)別:當X和Y的符號相同時,兩個函數(shù)的結(jié)果相同;當X和Y的符號不同時,REM和X的符號相同,mod和Y的符號相同。REM函數(shù)使用Fix函數(shù),mod函數(shù)使用floor函數(shù)。Fix函數(shù)和mod函數(shù)用于取整,F(xiàn)ix函數(shù)取整為0,floor函數(shù)取整為無窮小。REM(x,y)命令返回x-n.*y,如果y不等于0,其中n=fix(x./y),而mod(x,y)命令返回x-n.*y,如果y不等于0,則n=floor(x./y)。擴展數(shù)據(jù):兩個不同的符號整數(shù)取模值規(guī)則:先將兩個整數(shù)視為正數(shù),然后進行除法運算:當可除時,其值為0;當可除時,其值=除數(shù)×(整數(shù)商1)-被除數(shù)。例如:mod(36,-10)=-4,即:36除以10的整數(shù)商為3,加1后為4;36與除數(shù)的乘積為40;36與計數(shù)的差值為(40-36=4);除數(shù)的符號。所以這個值是-4。例如:mod(9,1.2)=0.6
從小白到設(shè)計,我們已經(jīng)探索了十年。我們來談?wù)剝纱蝹€人經(jīng)歷。
1. 找到一個好的公司和一個好的團隊是很重要的。它不一定是一個大工廠(當然,最好能進入),但應(yīng)該有你可以學(xué)習的東西。如果你不進去,早點換
!2. 繼續(xù)學(xué)習。設(shè)計知識和技能是最基本的要求。如果你不堅持在這方面學(xué)習和磨練,你就不能指望做得更好。除了基礎(chǔ),我們還應(yīng)該擴大知識,重視和理解設(shè)計前后的領(lǐng)域。不求精通,但求學(xué)習。如果你想做平面設(shè)計,你需要了解印刷生產(chǎn),網(wǎng)頁設(shè)計需要了解前端和后端,以及心理學(xué)、營銷策劃等。綜上所述,你需要知道設(shè)計需求的來龍去脈。我真的明白這一點。在優(yōu)秀的設(shè)計技巧的支持下,我想十年后會有一點成功。
當我還是一個貧窮的理科學(xué)生,畢業(yè)后,我去了設(shè)計坑。今天,除了糊里糊涂的樣子,我更靠的是堅持不懈的自學(xué)。自學(xué)PS、CDR、AI、C4d、PR從平面設(shè)計到網(wǎng)頁設(shè)計再到如今的團隊管理,沒有一天的培訓(xùn)課,小米和來福槍都是自己動手的。曾經(jīng)在廣告公司工作的設(shè)計專業(yè)同事都沒能堅守路線。有時我會感慨地回首往事。我覺得我現(xiàn)在不是很優(yōu)秀。相反,我常常覺得我的能力有限,我可以把很多工作做得更好。
做手機網(wǎng)站時,一定要注意手機網(wǎng)站的頁面大小,它直接影響網(wǎng)站的美觀和用戶體驗。尺寸定位也稱為兼容性。兼容性還包括許多方面,而不是維度定位。因為PC網(wǎng)站的大小是可以固定的,而固定的點也體現(xiàn)在寬度上。PC網(wǎng)站常用的寬度是1024像素(PX),這不需要前端人員在這個頁面上花費精力。但我們應(yīng)該特別注意移動網(wǎng)站。如果以640px為標準,當用戶使用320px手機訪問時,保守只能顯示網(wǎng)站大小的一半。如果發(fā)生這種情況,用戶體驗將受到影響,用戶將直接關(guān)閉網(wǎng)站。因此,我們做手機網(wǎng)站時,首先要了解主流手機的大小。目前主流手機有IOS系統(tǒng)和Android系統(tǒng)。我們只需要知道這兩種系統(tǒng)下手機的各種尺寸。
1. IOS系統(tǒng)
IOS系統(tǒng)中的iPhone,從iphone4到iphonexsmax,越來越大。對于IOS手機,一般只考慮兩種尺寸,一種是720px,另一種是1080px。如果是平板電腦,也可以通過跳轉(zhuǎn)來識別,但很多企業(yè)會建立一個以iPad為首的網(wǎng)站,方便iPad用戶訪問。
2. Android系統(tǒng)
Android系統(tǒng)中有480、720和1080px的手機尺寸。
3. 主流尺寸
對于手機網(wǎng)站的建設(shè)來說,更適合320、480和640px。所以前端技術(shù)只需要簡單的判斷。當然,如果有其他尺寸的,可以再次識別。
4. 識別
手機網(wǎng)站之所以出現(xiàn)半屏或超屏現(xiàn)象,完全是因為字體大小。因此,在移動網(wǎng)站中,我們不會使用PX來編寫代碼,而是使用em或REM來進行自適應(yīng)區(qū)分。但是記住EM和REM不能同時出現(xiàn)在同一個頁面上,否則會出現(xiàn)大小加載的情況。