Android屏幕尺寸与度量单位(px,dp,sp)简介

冲天香阵透长安，满城尽带黄金甲。这篇文章主要讲述Android屏幕尺寸与度量单位(px,dp,sp)简介相关的知识，希望能为你提供帮助。
MarkdownPad Document
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0 } body { font-family: Helvetica, arial, freesans, clean, sans-serif; font-size: 15px; line-height: 1.6; color: rgba(51, 51, 51, 1); background-color: rgba(255, 255, 255, 1); padding: 20px; max-width: 960px; margin: 0 auto } body>*:first-child { margin-top: 0 !important } body>*:last-child { margin-bottom: 0 !important } p, blockquote, ul, ol, dl, table, pre { margin: 15px 0 } h1, h2, h3, h4, h5, h6 { margin: 20px 0 10px; padding: 0; font-weight: bold; -webkit-font-smoothing: antialiased } h1 tt, h1 code, h2 tt, h2 code, h3 tt, h3 code, h4 tt, h4 code, h5 tt, h5 code, h6 tt, h6 code { font-size: inherit } h1 { font-size: 28px; color: rgba(0, 0, 0, 1) } h2 { font-size: 24px; border-bottom: 1px solid rgba(204, 204, 204, 1); color: rgba(0, 0, 0, 1) } h3 { font-size: 18px } h4 { font-size: 16px } h5 { font-size: 14px } h6 { color: rgba(119, 119, 119, 1); font-size: 14px } body>h2:first-child, body>h1:first-child, body>h1:first-child+h2, body>h3:first-child, body>h4:first-child, body>h5:first-child, body>h6:first-child { margin-top: 0; padding-top: 0 } a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 { margin-top: 0; padding-top: 0 } h1+p, h2+p, h3+p, h4+p, h5+p, h6+p { margin-top: 10px } a { color: rgba(65, 131, 196, 1); text-decoration: none } a:hover { text-decoration: underline } ul, ol { padding-left: 30px } ul li>:first-child, ol li>:first-child, ul li ul:first-of-type, ol li ol:first-of-type, ul li ol:first-of-type, ol li ul:first-of-type { margin-top: 0 } ul ul, ul ol, ol ol, ol ul { margin-bottom: 0 } dl { padding: 0 } dl dt { font-size: 14px; font-weight: bold; font-style: italic; padding: 0; margin: 15px 0 5px } dl dt:first-child { padding: 0 } dl dt>:first-child { margin-top: 0 } dl dt>:last-child { margin-bottom: 0 } dl dd { margin: 0 0 15px; padding: 0 15px } dl dd>:first-child { margin-top: 0 } dl dd>:last-child { margin-bottom: 0 } pre, code, tt { font-size: 12px; font-family: Consolas, "Liberation Mono", Courier, monospace } code, tt { margin: 0; padding: 0; white-space: nowrap; border: 1px solid rgba(234, 234, 234, 1); background-color: rgba(248, 248, 248, 1); border-radius: 3px } pre>code { margin: 0; padding: 0; white-space: pre; border: none; background: rgba(0, 0, 0, 0) } pre { background-color: rgba(248, 248, 248, 1); border: 1px solid rgba(204, 204, 204, 1); font-size: 13px; line-height: 19px; overflow: auto; padding: 6px 10px; border-radius: 3px } pre code, pre tt { background-color: rgba(0, 0, 0, 0); border: none } kbd { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background-color: rgba(221, 221, 221, 1); background-image: linear-gradient(rgba(241, 241, 241, 1), rgba(221, 221, 221, 1)); background-repeat: repeat-x; border-top: 1px solid rgba(221, 221, 221, 1); border-right: 1px solid rgba(204, 204, 204, 1); border-bottom: 1px solid rgba(204, 204, 204, 1); border-left: 1px solid rgba(221, 221, 221, 1); border-image: none; border-radius: 2px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 10px; padding: 1px 4px } blockquote { border-left: 4px solid rgba(221, 221, 221, 1); padding: 0 15px; color: rgba(119, 119, 119, 1) } blockquote>:first-child { margin-top: 0 } blockquote>:last-child { margin-bottom: 0 } hr { clear: both; margin: 15px 0; height: 0; overflow: hidden; border-top: none; border-right: none; border-bottom: 4px solid rgba(221, 221, 221, 1); border-left: none; background: rgba(0, 0, 0, 0); padding: 0 } table th { font-weight: bold } table th, table td { border: 1px solid rgba(204, 204, 204, 1); padding: 6px 13px } table tr { border-top: 1px solid rgba(204, 204, 204, 1); background-color: rgba(255, 255, 255, 1) } table tr:nth-child(2n) { background-color: rgba(248, 248, 248, 1) } img { max-width: 100% } .highlight { background: rgba(255, 255, 255, 1) } .highlight .c { color: rgba(153, 153, 136, 1); font-style: italic } .highlight .err { color: rgba(166, 23, 23, 1); background-color: rgba(227, 210, 210, 1) } .highlight .k { font-weight: bold } .highlight .o { font-weight: bold } .highlight .cm { color: rgba(153, 153, 136, 1); font-style: italic } .highlight .cp { color: rgba(153, 153, 153, 1); font-weight: bold } .highlight .c1 { color: rgba(153, 153, 136, 1); font-style: italic } .highlight .cs { color: rgba(153, 153, 153, 1); font-weight: bold; font-style: italic } .highlight .gd { color: rgba(0, 0, 0, 1); background-color: rgba(255, 221, 221, 1) } .highlight .gd .x { color: rgba(0, 0, 0, 1); background-color: rgba(255, 170, 170, 1) } .highlight .ge { font-style: italic } .highlight .gr { color: rgba(170, 0, 0, 1) } .highlight .gh { color: rgba(153, 153, 153, 1) } .highlight .gi { color: rgba(0, 0, 0, 1); background-color: rgba(221, 255, 221, 1) } .highlight .gi .x { color: rgba(0, 0, 0, 1); background-color: rgba(170, 255, 170, 1) } .highlight .go { color: rgba(136, 136, 136, 1) } .highlight .gp { color: rgba(85, 85, 85, 1) } .highlight .gs { font-weight: bold } .highlight .gu { color: rgba(170, 170, 170, 1) } .highlight .gt { color: rgba(170, 0, 0, 1) } .highlight .kc { font-weight: bold } .highlight .kd { font-weight: bold } .highlight .kp { font-weight: bold } .highlight .kr { font-weight: bold } .highlight .kt { color: rgba(68, 85, 136, 1); font-weight: bold } .highlight .m { color: rgba(0, 153, 153, 1) } .highlight .s { color: rgba(221, 17, 68, 1) } .highlight .na { color: rgba(0, 128, 128, 1) } .highlight .nb { color: rgba(0, 134, 179, 1) } .highlight .nc { color: rgba(68, 85, 136, 1); font-weight: bold } .highlight .no { color: rgba(0, 128, 128, 1) } .highlight .ni { color: rgba(128, 0, 128, 1) } .highlight .ne { color: rgba(153, 0, 0, 1); font-weight: bold } .highlight .nf { color: rgba(153, 0, 0, 1); font-weight: bold } .highlight .nn { color: rgba(85, 85, 85, 1) } .highlight .nt { color: rgba(0, 0, 128, 1) } .highlight .nv { color: rgba(0, 128, 128, 1) } .highlight .ow { font-weight: bold } .highlight .w { color: rgba(187, 187, 187, 1) } .highlight .mf { color: rgba(0, 153, 153, 1) } .highlight .mh { color: rgba(0, 153, 153, 1) } .highlight .mi { color: rgba(0, 153, 153, 1) } .highlight .mo { color: rgba(0, 153, 153, 1) } .highlight .sb { color: rgba(221, 17, 68, 1) } .highlight .sc { color: rgba(221, 17, 68, 1) } .highlight .sd { color: rgba(221, 17, 68, 1) } .highlight .s2 { color: rgba(221, 17, 68, 1) } .highlight .se { color: rgba(221, 17, 68, 1) } .highlight .sh { color: rgba(221, 17, 68, 1) } .highlight .si { color: rgba(221, 17, 68, 1) } .highlight .sx { color: rgba(221, 17, 68, 1) } .highlight .sr { color: rgba(0, 153, 38, 1) } .highlight .s1 { color: rgba(221, 17, 68, 1) } .highlight .ss { color: rgba(153, 0, 115, 1) } .highlight .bp { color: rgba(153, 153, 153, 1) } .highlight .vc { color: rgba(0, 128, 128, 1) } .highlight .vg { color: rgba(0, 128, 128, 1) } .highlight .vi { color: rgba(0, 128, 128, 1) } .highlight .il { color: rgba(0, 153, 153, 1) } .pl-c { color: rgba(150, 152, 150, 1) } .pl-c1, .pl-mdh, .pl-mm, .pl-mp, .pl-mr, .pl-s1 .pl-v, .pl-s3, .pl-sc, .pl-sv { color: rgba(0, 134, 179, 1) } .pl-e, .pl-en { color: rgba(121, 93, 163, 1) } .pl-s1 .pl-s2, .pl-smi, .pl-smp, .pl-stj, .pl-vo, .pl-vpf { color: rgba(51, 51, 51, 1) } .pl-ent { color: rgba(99, 163, 92, 1) } .pl-k, .pl-s, .pl-st { color: rgba(167, 29, 93, 1) } .pl-pds, .pl-s1, .pl-s1 .pl-pse .pl-s2, .pl-sr, .pl-sr .pl-cce, .pl-sr .pl-sra, .pl-sr .pl-sre, .pl-src, .pl-v { color: rgba(223, 80, 0, 1) } .pl-id { color: rgba(181, 42, 29, 1) } .pl-ii { background-color: rgba(181, 42, 29, 1); color: rgba(248, 248, 248, 1) } .pl-sr .pl-cce { color: rgba(99, 163, 92, 1); font-weight: bold } .pl-ml { color: rgba(105, 58, 23, 1) } .pl-mh, .pl-mh .pl-en, .pl-ms { color: rgba(29, 62, 129, 1); font-weight: bold } .pl-mq { color: rgba(0, 128, 128, 1) } .pl-mi { color: rgba(51, 51, 51, 1); font-style: italic } .pl-mb { color: rgba(51, 51, 51, 1); font-weight: bold } .pl-md, .pl-mdhf { background-color: rgba(255, 236, 236, 1); color: rgba(189, 44, 0, 1) } .pl-mdht, .pl-mi1 { background-color: rgba(234, 255, 234, 1); color: rgba(85, 165, 50, 1) } .pl-mdr { color: rgba(121, 93, 163, 1); font-weight: bold } .pl-mo { color: rgba(29, 62, 129, 1) } .task-list { padding-left: 10px; margin-bottom: 0 } .task-list li { margin-left: 20px } .task-list-item { list-style-type: none; padding-left: 10px } .task-list-item label { font-weight: 400 } .task-list-item.enabled label { cursor: pointer } .task-list-item+.task-list-item { margin-top: 3px } .task-list-item-checkbox { display: inline-block; margin-left: -20px; margin-right: 3px; vertical-align: 1px } 1.各度量单位的含义

px:pixels(像素）。显示器是由一个一个的像素点组成的，例如在通用显示器中，每英寸包括72个像素点；
dp:device independent pixels(设备独立像素），不同的设备有不同的显示效果，这个和设备硬件有关；android中，使用dp可以对目标进行自动缩放，比较方便兼容不同尺寸的设备；详见下面介绍；
dip:和dp是一样的，Android的早期版本使用了dip这个称呼，后来改成了dp；
pt:point，这个是一个标准的长度单位，注意与px区分，1pt=1/72英寸，主要用于印刷行业
sp:scaled pixels，主要用于字体的大小显示，个人理解，sp其实和dp差不多，唯一的区别在于sp可以随系统字体进行放大缩小，，当在设置中选中大字体模式后，使用sp标注的字体大小会自动缩放；
in（英寸）：长度单位
mm（毫米）：长度单位
PPI：密度单位，表示每英寸包括多少个像素点，如显示器一般为72ppi

2.像素密度Android设备主要包括以下几种屏幕:

屏幕	宽度	高度	尺寸	屏幕密度
QVGA	240	320	2.6-3.0	LOW
WQVGA	240	400	3.2-3.5	LOW
FWQVGA	240	432	3.5-3.8	LOW
HVGA	320	480	3.0-3.5	MEDIUM
WVGA	480	800	3.3-4.0	high
FWVGA	480	854	3.5-4.0	HIGH
wvga	480	800	4.8-5.5	MEDIUM
FWVGA	480	854	5.0-5.8	MEDIUM
VGA	480	640	2.8	286ppi

备注：目前Android默认的low=120; medium=160; high=240
设备信息有很多，具体的可以参考下面链接：
http://www.xyaz.cn/thread-71-1-1.html
3.px与dp的转换转换公式为：
px=dp*density/160。denisty表示屏幕密度，即当density=160时，1dp = 1px = 1sp;