【CSS】基本单位

布局

概念	描述
响应式	根据不同设备不同布局
语法	`@media only
媒体类型	`all(所有)

视口

概念	描述
viewport	视口：屏幕中用来显示网页的区域
移动端	因为移动端的视口不一样因此需要单独适配，因此建议使用最佳像素比
语法	<meta name="viewport" content="width=根据设备宽度设置px" />
最佳像素比	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

尺寸

属性	描述
width	设置元素的宽度
height	设置元素的高度
max-height	设置元素的最大高度
max-width	设置元素的最大宽度
min-height	设置元素的最小高度
min-width	设置元素的最小宽度
vw	可视窗口的宽度
vh	可视窗口的高度

长度

概念	描述
像素	显示器屏幕是由一个一个的小点（单位色块，即像素）构成的，单位：px
屏幕分辨率	分辨率 = 水平方向像素 * 垂直方向像素
百分比	将属性值设置为相对于其父元素属性的百分比，使子元素跟随父元素的改变而改变，单位：%
em	根据元素本身的字体大小来计算，根据字体变化而改变，公式：1em = <self>.font-size * 10
rem	根据根元素的字体大小来计算，根据字体变化而改变，公式：1em = <root>.font-size * 10

颜色

概念	语法	范围
RGB值	RGB(red, green, blue)	每一种颜色的范围在 0 ~ 255（0% ~ 100%）之间
RGBA	RGBA(red, green, blue，a)	a 表示不透明度，1表示完全不透明 0表示完全透明 .5半透明
十六进制RGB	#RRGGBB	每一种颜色的范围在00 ~ ff之间