几大标签

开头引入文件

• • reset.css文件是（通配符温柔版）：选择带有边距的元素，将其内外边距、边框设置为0。此处版本的reset.css还给body进行了初始化设置，字体大小等等

    

主内容区域

• 设置一个最大宽度，见注释

  

• 分组选择器写法

  

分布问题以及自适应

• display：flex一般在移动端中使用（只单行分布），自动水平分布目的是自适应。
• flex-wrap：wrap，意为文本多行分布nowrap为单行
• justify-content: space-around;将留白部分平均分配元素四周

  

文本位置水平、垂直居中的写法

• 水平分布变竖直分布

  

• 根据屏幕大小来决定宽度 百分比见注释

  

• 文本垂直居中的方法：定位再平移

  

• 平移

    /* 平移  （X Y） */
      transform: translate(-50%,-50%);
  

在屏幕上的显示设置

• @media screen用and和后面设置的数据之间要用括号以及and连接起来