今天就跟大家聊聊有關(guān)CSS中的三種長(zhǎng)度單位，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結(jié)了以下內(nèi)容，希望大家根據(jù)這篇文章可以有所收獲。

發(fā)展壯大離不開(kāi)廣大客戶長(zhǎng)期以來(lái)的信賴(lài)與支持，我們將始終秉承“誠(chéng)信為本、服務(wù)至上”的服務(wù)理念，堅(jiān)持“二合一”的優(yōu)良服務(wù)模式，真誠(chéng)服務(wù)每家企業(yè)，認(rèn)真做好每個(gè)細(xì)節(jié)，不斷完善自我，成就企業(yè)，實(shí)現(xiàn)共贏。行業(yè)涉及成都玻璃鋼雕塑等，在網(wǎng)站建設(shè)公司、網(wǎng)絡(luò)營(yíng)銷(xiāo)推廣、WAP手機(jī)網(wǎng)站、VI設(shè)計(jì)、軟件開(kāi)發(fā)等項(xiàng)目上具有豐富的設(shè)計(jì)經(jīng)驗(yàn)。

絕對(duì)長(zhǎng)度

px

px是像素值，是一個(gè)固定的長(zhǎng)度，比如我們的米，厘米一樣。

相對(duì)長(zhǎng)度

為什么我們需要相對(duì)長(zhǎng)度rem em等？

固定長(zhǎng)度已經(jīng)不能滿足我們現(xiàn)在的需求了。

舉例：比如我們?cè)诳s小我們屏幕的時(shí)候，我們不僅僅是需要縮小我們的盒子的寬高，我們還想要讓我們字體大小也隨之縮小，這樣用戶體驗(yàn)會(huì)更好一點(diǎn)。

rem

rem 與 px 的計(jì)算關(guān)系

rem的值是px的倍數(shù)

默認(rèn)情況下font-size = 16px,那么1rem = 16px

rem 如何修改與px的相對(duì)計(jì)算關(guān)系

我們可以在并且只能在html標(biāo)簽（因?yàn)閔tml節(jié)點(diǎn)是根節(jié)點(diǎn)，就是rem里面的r：root）里面修改font-size : 32px， 從而1rem = 32px

代碼

<p class="p-rem">rem</p>
/* rem的用法 */
html{
    font-size:16px;  // 1rem = 16px
}
.p-rem{
    width: 10rem;    // 10rem = 10 x 16 = 160px
    height: 10rem;   // 10rem = 10 x 16 = 160px
    font-size: 1rem; // 1rem = 16px
    background-color: #a58778;
}

em

em 與 px 的計(jì)算關(guān)系

em的值是px的倍數(shù)

默認(rèn)情況下font-size = 16px,那么1em = 16px

em 如何修改與px的相對(duì)計(jì)算關(guān)系

我們可以在自己元素上面修改font-size : 32px， 從而1em = 32px

如果自己元素上面沒(méi)有設(shè)置font-size, 我們也可以在父元素上面設(shè)置font-size，從而來(lái)影響自己元素（孩子元素）使用的em的值。

看完上述內(nèi)容，你們對(duì)CSS中的長(zhǎng)度單位有進(jìn)一步的了解嗎？如果還想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀。

名稱(chēng)欄目：CSS中的長(zhǎng)度單位介紹
分享網(wǎng)址：http://jinyejixie.com/article22/ggchcc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站設(shè)計(jì)、網(wǎng)站制作、網(wǎng)站維護(hù)、網(wǎng)站導(dǎo)航、品牌網(wǎng)站設(shè)計(jì)、網(wǎng)站排名

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)