一.分栏
column-width 栏目宽度
该属性主要用来定义每栏的宽度。
column-count 栏目列数
指定了需要分割的列数；
column-gap 栏目距离
该属性主要定义两栏之间的间距距离。
column-rule 栏目间隔线
该属性定义每栏之间边框的宽度、样式和颜色。
缩写：
二.媒体查询
使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。
@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有用的。
当你重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。
三 .meta元数据标签
Meta标签是用来描述HTML文档的信息。HTML语言中HEAD区的一个辅助性标签，它位于HTML文档头部的<head>标记 和<title>标记之间，它提供用户不可见的信息。
width=device-width：宽度等于设备宽度
initial-scale=1.0：默认缩放1.0
maxinmum-scale=1.0：最大缩放1.0
user-scalable=0：用户不允许手动缩放（不加上面三条的话，手机端屏幕会一点就变大哦）
name="viewport"：声明是视图层
px、em与rem的区别：
px是固定的像素，一旦设置了就无法因为适应页面大小而改变。
em和rem相对于px更具有灵活性，他们是相对长度单位，意思是长度不是定死了的，更适用于响应式布局。
对于em和rem的区别一句话概括：em相对于父元素，rem相对于根元素。
rem中的r意思是root（根源）
em
- 子元素字体大小的em是相对于父元素字体大小
- 元素的width/height/padding/margin用em的话是相对于该元素的font-size
rem
rem是全部的长度都相对于根元素，根元素是谁？<html>元素。通常做法是给html元素设置一个字体大小，然后其他元素的长度单位就为rem。
如果加上box-size不会影响盒子大小
4086
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
