网页设计中常听的属性名：内容(content)、填充(padding)、边框(border)、边界(margin)，
CSS盒子模式都具备这些属性。
这些属性可以把它转移到日常生活中的盒子（箱子）上来理解，日常生活中所见的盒子也就是能装东西的一种箱子，也具有这些属性，所以叫它盒子模式。
每个盒子都有：边界、边框、填充、内容四个属性；
每个属性都包括四个部分：上、右、下、左；这四部分可同时设置，也可分别设置；里的抗震辅料厚度，而边框有大小和颜色之分，又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。
1、内联式css样式，直接写在现有的HTML标签中
<p style="color:red">这里文字是红色。</p><p style="color:redfont-size:12px">这里文字是红色。</p>2、嵌入式css样式，写在当前的文件中
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html charset=utf-8"><title>嵌入式css样式</title><style type="text/css">span{ color:blue}</style></head><body><p>小明<span>上课</span>不注意<span>听老师</span>讲课，<span>以至于</span>期末考试成绩很差！</p></body></html>
1.css3常用的布局有多栏布局、多列布局、弹性布局、流式布局、瀑布流布局和响应式布局。2.float浮动布局，absolute绝对定位，flex弹性盒子，table表格布局，grid网格布局 / 栅格化布局
3.移动端布局：流式布局(百分比布局)JD,flex弹性布局(强烈推荐)携程,less+rem+媒体查询布局 苏宁,
css设计模式
OOCSS——Object Oriented CSS
SMACSS——Scalable and Modular Architecture for CSS
垂直水平均分：
子元素纵向等距排列：
总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距
IE盒子模型width=width(margin+padding) 解决IE8及更早版本不兼容问题可以在HTML页面声明 <!DOCTYPE html>即可。
