(三)CSS盒模型
文章目录 尺寸与颜色单位 1. 尺寸单位 2. 颜色单位 CSS 盒模型 1. 内容尺寸 2. 边框 1). 边框实现 2). 单边框设置 3). 圆角边框 4). 轮廓线 5). 盒阴影 3. 内边距 4. 外边距 5. 元素最终尺寸的计算 尺寸与颜色单位 1. 尺寸单位 px 像素单位 % 百分比，参照父元素对应属性的值进行计算 响应式页面 （适配不同设备屏幕） em 字体尺寸单位，参照父元素的字体倍数大小计算，1em=16px rem字体尺寸单位,参照根元素(**html **)的字体倍数大小计算，1rem=16px 2. 颜色单位 英文单词：red，green，blue rgb(r,g,b) 使用三原色表示，每种颜色取值0~255 rgba(r,g,b, alpha ) 三原色每种取值0~255，alpha取值0（透明）~1（不透明） 十六进制表示：以#为前缀，分为长十六进制和短十六进制。 长十六进制：每两位为一组，代表一种三原色；每位的取值范围0~9，a~f 例：red rgb(255,0,0) #ff 00 00 短十六进制：由3位组成，每一位代表一种三原色，浏览器会自动对每一位进行重复扩充，仍然按照长十六进制解析 例：#000 #fff #f00 CSS 盒模型 1. 内容尺寸 一般情况下，为元素设置width/height，指定的是内容框的大小 内容溢出