Web 前端设计

1 资源

完美的全屏幕背景图：https://phphub.org/topics/513

CSS实现垂直居中的5种方法: http://www.qianduan.net/css-to-achieve-the-vertical-center-of-the-five-kinds-of-methods/

2 单位

pt (point，磅) 是一个物理长度单位，指的是 1/72 英寸
px (pixel，像素) 是一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果 px 要换算成物理长度，需要指定精度 DPI (Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是 72dpi
em 是一个相对长度单位，最初是指字母 M 的宽度，故名em。现指的是字符宽度的倍数，用法类似百分比，如：0.8em, 1.2em,2em等。通常1em = 16px

字号是中文字库中特有的一种单位，以中文代号表示特定的磅值 pt，便于记忆、表述

pt 和 px 的换算公式可以根据 pt 的定义得出:

pt = 1/72(英寸), px = 1/dpi(英寸)

因此 pt = px*72/dpi

以Windows下的 96dpi 来计算，pt = px*72/96 = px*3/4

初号     42pt     56px     3.5em
小初     36pt     48px     3em
         34pt     45px     2.75em
         32pt     42px     2.55em
         30pt     40px     2.45em 
         29pt     38px     2.35em
         28pt     37px     2.3em
         27pt     36px     2.25em
一号     26pt     35px     2.2em
         25pt     34px     2.125em
小一     24pt     32px     2em
二号     22pt     29px     1.8em
         20pt     26px     1.6em
小二     18pt     24px     1.5em
         17pt     23px     1.45em
三号     16pt     22px     1.4em
小三     15pt     21px     1.3em
         14.5pt     20px     1.25em
四号     14pt     19px     1.2em
         13.5pt     18px     1.125em
         13pt     17px     1.05em
小四     12pt     16px     1em
         11pt     15px     0.95em
五号     10.5pt     14px     0.875em
         10pt     13px     0.8em
小五      9pt     12px     0.75em
          8pt     11px     0.7em
六号    7.5pt     10px     0.625em
          7pt      9px     0.55em
小六    6.5pt      8px     0.5em
七号    5.5pt      7px     0.4375em
八号      5pt      6px     0.375em

-----------------
注：本表中pt的计算基于96dpi