CSS中的長(zhǎng)度值有哪些

這篇文章主要介紹“CSS中的長(zhǎng)度值有哪些”,在日常操作中,相信很多人在CSS中的長(zhǎng)度值有哪些問題上存在疑惑,小編查閱了各式資料,整理出簡(jiǎn)單好用的操作方法,希望對(duì)大家解答”CSS中的長(zhǎng)度值有哪些”的疑惑有所幫助!接下來,請(qǐng)跟著小編一起來學(xué)習(xí)吧!

創(chuàng)新互聯(lián)公司始終致力于在企業(yè)網(wǎng)站建設(shè)領(lǐng)域發(fā)展。秉承“創(chuàng)新、求實(shí)、誠信、拼搏”的企業(yè)精神,致力為企業(yè)提供全面的網(wǎng)絡(luò)宣傳與技術(shù)應(yīng)用整體策劃方案,為企業(yè)提供包括“網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)、微信網(wǎng)站建設(shè)、微信平臺(tái)小程序開發(fā)商城系統(tǒng)網(wǎng)站開發(fā)、平臺(tái)網(wǎng)站建設(shè)秉承"和諧、參與、激情"的文化,與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng),共同發(fā)展。

目前比較常用到px(像素)、em、% 百分比,要注意其實(shí)這三種單位都是相對(duì)單位。

1、像素

像素為什么是相對(duì)單位呢?因?yàn)橄袼刂傅氖秋@示器上的小點(diǎn)(CSS規(guī)范中假設(shè)“90像素=1英寸”)。實(shí)際情況是瀏覽器會(huì)使用顯示器的實(shí)際像素值有關(guān),在目前大多數(shù)的設(shè)計(jì)者都傾向于使用像素(px)作為單位。

2、em

就是本元素給定字體的 font-size 值,如果元素的 font-size 為 14px ,那么 1em = 14px;如果 font-size 為 18px,那么 1em = 18px。如下代碼:

p{font-size:12px;text-indent:2em;}

上面代碼就是可以實(shí)現(xiàn)段落首行縮進(jìn) 24px(也就是兩個(gè)字體大小的距離)。

下面注意一個(gè)特殊情況:

但當(dāng)給 font-size 設(shè)置單位為 em 時(shí),此時(shí)計(jì)算的標(biāo)準(zhǔn)以 p 的父元素的 font-size 為基礎(chǔ)。如下代碼:

html:

<p>以這個(gè)<span>例子</span>為例。</p>

css:

p{font-size:14px}

span{font-size:0.8em;}

結(jié)果 span 中的字體“例子”字體大小就為 11.2px(14 * 0.8 = 11.2px)。

3、百分比

p{font-size:12px;line-height:130%}

設(shè)置行高(行間距)為字體的130%(12 * 1.3 = 15.6px)。

到此,關(guān)于“CSS中的長(zhǎng)度值有哪些”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí),請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站,小編會(huì)繼續(xù)努力為大家?guī)砀鄬?shí)用的文章!

當(dāng)前文章:CSS中的長(zhǎng)度值有哪些
網(wǎng)頁路徑:http://muchs.cn/article14/gecede.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供企業(yè)建站軟件開發(fā)、App設(shè)計(jì)、商城網(wǎng)站、響應(yīng)式網(wǎng)站、全網(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í)需注明來源: 創(chuàng)新互聯(lián)

商城網(wǎng)站建設(shè)