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: #333; background-color: #fff; 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 }
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: #000 }
h2 { font-size: 24px; border-bottom: 1px solid #ccc; color: #000 }
h3 { font-size: 18px }
h4 { font-size: 16px }
h5 { font-size: 14px }
h6 { color: #777; 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: #4183C4; 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: 0px }
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: 0px }
dl dt>:last-child { margin-bottom: 0px }
dl dd { margin: 0 0 15px; padding: 0 15px }
dl dd>:first-child { margin-top: 0px }
dl dd>:last-child { margin-bottom: 0px }
pre,code,tt { font-size: 12px; font-family: Consolas, "Liberation Mono", Courier, monospace }
code,tt { margin: 0 0px; padding: 0px 0px; white-space: nowrap; border: 1px solid #eaeaea; background-color: #f8f8f8 }
pre>code { margin: 0; padding: 0; white-space: pre; border: none; background: transparent }
pre { background-color: #f8f8f8; border: 1px solid #ccc; font-size: 13px; line-height: 19px; overflow: auto; padding: 6px 10px }
pre code,pre tt { background-color: transparent; border: none }
kbd { background-color: #DDDDDD; background-image: linear-gradient(#F1F1F1, #DDDDDD); background-repeat: repeat-x; border-color: #DDDDDD #CCCCCC #CCCCCC #DDDDDD; border-style: solid; border-width: 1px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 10px; padding: 1px 4px }
blockquote { border-left: 4px solid #DDD; padding: 0 15px; color: #777 }
blockquote>:first-child { margin-top: 0px }
blockquote>:last-child { margin-bottom: 0px }
hr { clear: both; margin: 15px 0; height: 0px; overflow: hidden; border: none; background: transparent; border-bottom: 4px solid #ddd; padding: 0 }
table th { font-weight: bold }
table th,table td { border: 1px solid #ccc; padding: 6px 13px }
table tr { border-top: 1px solid #ccc; background-color: #fff }
table tr:nth-child(2n) { background-color: #f8f8f8 }
img { max-width: 100% }
.highlight { background: #ffffff }
.highlight .c { color: #999988; font-style: italic }
.highlight .err { color: #a61717; background-color: #e3d2d2 }
.highlight .k { font-weight: bold }
.highlight .o { font-weight: bold }
.highlight .cm { color: #999988; font-style: italic }
.highlight .cp { color: #999999; font-weight: bold }
.highlight .c1 { color: #999988; font-style: italic }
.highlight .cs { color: #999999; font-weight: bold; font-style: italic }
.highlight .gd { color: #000000; background-color: #ffdddd }
.highlight .gd .x { color: #000000; background-color: #ffaaaa }
.highlight .ge { font-style: italic }
.highlight .gr { color: #aa0000 }
.highlight .gh { color: #999999 }
.highlight .gi { color: #000000; background-color: #ddffdd }
.highlight .gi .x { color: #000000; background-color: #aaffaa }
.highlight .go { color: #888888 }
.highlight .gp { color: #555555 }
.highlight .gs { font-weight: bold }
.highlight .gu { color: #aaaaaa }
.highlight .gt { color: #aa0000 }
.highlight .kc { font-weight: bold }
.highlight .kd { font-weight: bold }
.highlight .kp { font-weight: bold }
.highlight .kr { font-weight: bold }
.highlight .kt { color: #445588; font-weight: bold }
.highlight .m { color: #009999 }
.highlight .s { color: #d14 }
.highlight .na { color: #008080 }
.highlight .nb { color: #0086B3 }
.highlight .nc { color: #445588; font-weight: bold }
.highlight .no { color: #008080 }
.highlight .ni { color: #800080 }
.highlight .ne { color: #990000; font-weight: bold }
.highlight .nf { color: #990000; font-weight: bold }
.highlight .nn { color: #555555 }
.highlight .nt { color: #000080 }
.highlight .nv { color: #008080 }
.highlight .ow { font-weight: bold }
.highlight .w { color: #bbbbbb }
.highlight .mf { color: #009999 }
.highlight .mh { color: #009999 }
.highlight .mi { color: #009999 }
.highlight .mo { color: #009999 }
.highlight .sb { color: #d14 }
.highlight .sc { color: #d14 }
.highlight .sd { color: #d14 }
.highlight .s2 { color: #d14 }
.highlight .se { color: #d14 }
.highlight .sh { color: #d14 }
.highlight .si { color: #d14 }
.highlight .sx { color: #d14 }
.highlight .sr { color: #009926 }
.highlight .s1 { color: #d14 }
.highlight .ss { color: #990073 }
.highlight .bp { color: #999999 }
.highlight .vc { color: #008080 }
.highlight .vg { color: #008080 }
.highlight .vi { color: #008080 }
.highlight .il { color: #009999 }
.pl-c { color: #969896 }
.pl-c1,.pl-mdh,.pl-mm,.pl-mp,.pl-mr,.pl-s1 .pl-v,.pl-s3,.pl-sc,.pl-sv { color: #0086b3 }
.pl-e,.pl-en { color: #795da3 }
.pl-s1 .pl-s2,.pl-smi,.pl-smp,.pl-stj,.pl-vo,.pl-vpf { color: #333 }
.pl-ent { color: #63a35c }
.pl-k,.pl-s,.pl-st { color: #a71d5d }
.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: #df5000 }
.pl-id { color: #b52a1d }
.pl-ii { background-color: #b52a1d; color: #f8f8f8 }
.pl-sr .pl-cce { color: #63a35c; font-weight: bold }
.pl-ml { color: #693a17 }
.pl-mh,.pl-mh .pl-en,.pl-ms { color: #1d3e81; font-weight: bold }
.pl-mq { color: #008080 }
.pl-mi { color: #333; font-style: italic }
.pl-mb { color: #333; font-weight: bold }
.pl-md,.pl-mdhf { background-color: #ffecec; color: #bd2c00 }
.pl-mdht,.pl-mi1 { background-color: #eaffea; color: #55a532 }
.pl-mdr { color: #795da3; font-weight: bold }
.pl-mo { color: #1d3e81 }
.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;
转载请注明原文地址：