首先需要明白，盒子模型主要定义四个区域：内容（content）、边框与内容的区域，称为内边距（padding）、边框（border）、边框与外部的区域，称为外边距（margin）。

区别​

1. margin：表示边框以外的区域
2. padding：表示边框与内容之间的区域

使用场景​

添加字体包​

推荐：https://fonts.google.com/

在网上找资源或者问设计同学要。

引入字体包​

存放位置归类（自由放置即可）​

颜色函数​

• rgb()：RGB色彩模式
• rgba()：RGBA色彩模式
• hsl()：HSL色彩模式
• hsla()：HSLA色彩模式
• color()：色彩模式，基于当前颜色衍生出其他颜色

属性函数​

• attr()：属性
• var()：变量

数学函数​

首先需要明白，盒子模型主要定义四个区域：内容（content）、边框与内容的区域，称为内边距（padding）、边框（border）、边框与外部的区域，称为外边距（margin）。

区别

设置内容显示多少行，多余的内容添加省略号

.ellipsis {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  
/ / moz 不设置也可以 display:-moz-box;
  -moz-box-orient: vertical;
  -moz-line-clamp: 1;
}