漫談CSS之字型大小font size

2021-07-09 13:57:09 字數 1542 閱讀 1497

字型大小的單位主要有

說明:

1. em單位是相對使用者瀏覽器的預設字型大小而言

2. ex是相對 高度而言

3. px是相對電腦螢幕所能顯示的最小的點

如何使文字大小在不同瀏覽器和作業系統上保持一致:

說說em如何使用

首先舉個栗子例如,預設瀏覽器字型大小為16px

把body元素的font-size設定為62.5%,body的字型大小就為16px*0.625=10px

接著就可以把繼承的表單和**元素font-size設定為1em

input,select,th,td

這樣,web文件中的1em就等於10px

p

如果開發者想把標題設定為24px,段落文字設為15px,用上面的方法就可以

示例

font.html

lang="en">

charset="utf-8">

rel="stylesheet"

type="text/css" href="font.css">

title>

head>

這是段落p>

**標題th>

tr>

**列一tr>

**列一tr>

value="input請輸入">

上面展示字型的大小可以隨瀏覽器設定的字型大小而改變。

當然,如果你設為px,無論你怎麼變都是下面的效果,因為它是基於畫素點,也就是說定了px,字型的大小就固定了。

結論:不要使用px設定字型大小!!

使用 rem 設定文字大小*

em是基於父元素的,上面的例子有展示。

rem 的出現解救了我這樣不會算術的人,再也不用擔心父級元素的 font-size 了,因為它始終是基於根元素(html) 的。

這篇文章還是好久之前學習css寫的心得了,特意放在這裡,希望對初學css的人有所幫助。

Css 中常用的字型大小

css font size字型文字大小樣式屬性 字型大小樣式篇 本節divcss5為大家介紹通過css樣式設定文字字型大小知識,涉及css樣式單詞font size。目錄設定字型大小css單詞與語法 font size使用方法 font size效果截圖 font size 5什麼意思 css fo...

20160422 css 字型大小設定

1.檔案大小與其影象解析度的平方成正比。如果保持影象尺寸不變,將影象解析度提高一倍,則其檔案大小增大為原來的四倍。計算方程式 x 長度畫素數 y 寬度畫素數 z 螢幕尺寸即對角線長度 2.一張解析度為640 x 480 30w畫素 一張解析度為1600 x 1200的,它的畫素就是200萬。3.根本...

CSS字型大小之em,px,百分比

首先要記住網頁中常規字型的大小為16px。px是用來設定字型的絕對大小。通常為用於物理值的設定。我們在網際網路上看到的常規字型大小為16px。而em是指相對于父元素的大小。1em是父元素的1倍,2em就是大小為父元素的2倍。當前,一般情況下,父元素的預設字型為16px。所以通常會認為1em 16px...