CSS 单位

CSS 单位

CSS 有几种表示长度的不同单位。

许多 CSS 属性接受“长度”值,诸如 widthమరియుmarginమరియుpaddingమరియుfont-size మొదలైనది.

长度是一个后面跟着长度单位的数字,诸如 10pxమరియు2em మొదలైనది.

ఉదాహరణ

px (పిక్సెల్) యొక్క వివిధ పొడవు విలువలను సెట్ చేయండి:

h1 {
  font-size: 60px;
}
p {
  font-size: 25px;
  line-height: 50px;
}

స్వయంగా ప్రయత్నించండి

సంఖ్య మరియు యూనిట్ మధ్య అంతరం లేకుండా ఉండాలి. కానీ, విలువ నలుపు అయితే, యూనిట్ను మినహాయించవచ్చు.

కొన్ని CSS అట్రిబ్యూట్లకు, ప్రత్యర్థ పొడవును ఉపయోగించడానికి అనుమతిస్తారు.

పొడవు యూనిట్లు రెండు రకాలు ఉన్నాయి:అబ్సూల్యూట్ యూనిట్మరియుప్రత్యర్థ యూనిట్.

అబ్సూల్యూట్ పొడవు

అబ్సూల్యూట్ పొడవు యూనిట్లు నిర్ధారితం అవుతాయి, ఏ అబ్సూల్యూట్ పొడవును వాడిన పొడవు ఆ పరిమాణంలో ప్రదర్శించబడుతుంది.

స్క్రీన్లో అబ్సూల్యూట్ పొడవు యూనిట్లను ఉపయోగించకుండా ఉండాలి, ఎందుకంటే స్క్రీన్ పరిమాణం చాలా మారుతుంది. కానీ, ప్రస్తుత అవుట్పుట్ మీడియం తెలిసినపుడు, వాటిని ఉపయోగించవచ్చు, ఉదాహరణకు ప్రింట్ లేఆఉట్ యొక్క ఉపయోగం వంటి.

యూనిట్ వివరణ TIY
cm సెంటీమీటర్ 试一试
mm మిలీమీటర్ 试一试
in ఇంచ్ (1in = 96px = 2.54cm) 试一试
px * పిక్సెల్ (1px = 1/96th of 1in) 试一试
pt పాయింట్ (1pt = 1/72 of 1in) 试一试
pc పాక్కా (1pc = 12 pt) 试一试

* పిక్సెల్ (px) వీక్షణ పరికరానికి సంబంధించినది. తక్కువ dpi యొక్క పరికరాలకు, 1px ప్రదర్శకం యొక్క పరికర పిక్సెల్ (పాయింట్). ప్రింటర్లు మరియు అధిక రిజల్యూషన్ స్క్రీన్లకు, 1px అనేది అనేక పరికర పిక్సెల్లను సూచిస్తుంది.

ప్రత్యర్థ పొడవు

ప్రత్యర్థ పొడవు యూనిట్ ప్రత్యర్థ పొడవు స్పెక్ట్రం యొక్క పొడవు యొక్క పొడవును నిర్ణయిస్తుంది. ప్రత్యర్థ పొడవు యూనిట్లు వివిధ రూపాయింపు మాధ్యమాలు మధ్య మలచుకున్నారు.

యూనిట్ వివరణ TIY
em ఎలమెంట్ యొక్క ఫాంట్ సైజ్ (font-size) యొక్క ప్రత్యర్థం (2em అనేది ప్రస్తుత ఫాంట్ సైజ్ యొక్క 2 రెట్లు) 试一试
ex ప్రస్తుత ఫాంట్ యొక్క x-height (అరుదుగా ఉపయోగిస్తారు) 试一试
ch 0 (నలుపు) యొక్క వెడల్పు 试一试
rem రూట్ ఎలమెంట్ యొక్క ఫాంట్ సైజ్ (font-size) 试一试
vw వీక్షణ పోర్టులో * వెడల్పు యొక్క 1% 试一试
vh వీక్షణ పోర్టులో * అడుగుని యొక్క 1% 试一试
vmin వీక్షణ పోర్టులో * చిన్న పరిమాణం యొక్క 1% 试一试
vmax 相对于视口*较大尺寸的 1% 试一试
% 相对于父元素 试一试

提示:em 和 rem 单元可用于创建完美的可扩展布局!

* 视口(Viewport)= 浏览器窗口的尺寸。如果视口为 50 厘米宽,则 1vw = 0.5 厘米。

浏览器支持

పట్టికలో పేర్కొన్న బ్రౌజర్లు ఈ లెంగ్త ఇకానాను పూర్తిగా మద్దతు ఇస్తాయి.

లెంగ్త ఇకానా ఇకానా
em, ex, %, px, cm, mm, in, pt, pc 1.0 3.0 1.0 1.0 3.5
ch 27.0 9.0 1.0 7.0 20.0
rem 4.0 9.0 3.6 4.1 11.6
vh, vw 20.0 9.0 19.0 6.0 20.0
vmin 20.0 12.0 19.0 6.0 20.0
vmax 26.0 16.0 19.0 7.0 20.0