CSS 的長度單位

2021-08-22 10:22:27 字數 1183 閱讀 7809

長度單位包括包括:相對單位和絕對單位。

相對長度單位包括有: em, ex, ch, rem, vw, vh, vmax, vmin

絕對長度單位包括有: cm, mm, q, in, pt, pc, px

em相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸。

ex相對長度單位。相對於字元「x」的高度。通常為字型高度的一半。如當前對行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸

ch數字「0」的寬度

rem相對於根元素(即html元素)font-size計算值的倍數

vh相對於視口的高度。視口被均分為100單位的vhvw      相對於視口的寬度。視口被均分為100單位的vw

vmax相對於視口的寬度或高度,總是相對於大的那個。視口的寬度或高度被均分為100單位的vmax

vmin相對於視口的寬度或高度,總是相對於小的那個。視口的寬度或高度被均分為100單位的vmin

cm絕對長度單位: 厘公尺(centimeters)    1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

mm公釐(millimeters)

q1/4公釐(quarter-millimeters)

in英吋(inches)

pt點(points)

pc派卡(picas)   相當於我國新四號鉛字的尺寸。

px相對長度單位。畫素(pixels)。

1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

可以根據螢幕寬度進行自適應。規定螢幕寬為750rpx。如在 iphone6 上,螢幕寬度為375px,共有750個物理畫素,則750rpx = 375px = 750物理畫素,1rpx = 0.5px = 1物理畫素。

css 長度單位

畫素 螢幕 顯示器 實際上是由乙個乙個的小點點構成的 不同螢幕的畫素大小是不同的,畫素越小的螢幕顯示的效果越清晰 所以同樣的200px在不同的裝置下顯示效果不一樣 百分比 也可以將屬性值設定為相對於其父元素屬性的百分比 設定百分比可以使子元素跟隨父元素的改變而改變 doctype html en u...

CSS的長度單位

css相對長度單位中的相對二字,表明了其長度單位會隨著它的參考值的變化而變化,不是固定的。以下是css相對長度單位列表 css相對長度單位 說明em 元素的字型高度the height of the element s font ex字母x的高度the height of the letter x ...

css的長度單位

css中長度單位有很多,可謂五花八門,但可分為這兩類 絕對長度單位 彼此固定,不會因為其他元素的尺寸變化而變化。主要有cmmmqinpcptpx相對長度單位 指定相對於另一長度的長度。主要有emexchrem 和可視區百分比長度單位vmvhvminvmaxpx單位名稱為畫素,畫素或許被認為是最好的 ...