前端面试题之 CSS3

1. CSS3有哪些新特性？

   • CSS3实现圆角（border-radius），阴影（box-shadow），边框图片 border-image
   • 对文字加特效（text-shadow、），强制文本换行（word-wrap），线性渐变（linear-gradient）
   • 旋转,缩放,定位,倾斜：transform:rotate(90deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg)
   • 增加了更多的CSS选择器、多背景、rgba()
   • 在CSS3中唯一引入的伪元素是 ::selection
   • 媒体查询 (@media)，多栏布局(flex)

2. 谈谈你对盒模型的理解（标准盒模型和怪异盒模型的区别）。

   • 标准盒模型：content（内容区）+padding（填充区）+border（边框）+margin（外边距)
   • 怪异盒模型：width{content（内容区）+padding（填充区）+border（边框）}+margin（外边距）
   • 异同：
     • 标准盒模型和怪异盒模型本质上都是一个盒子，它们的区别就是计算宽度和高度的不同
     • 标准盒模型是盒子的总宽度=内容区+填充区+边框+外边距，它的内容区是不包含填充区和边框的
     • 怪异盒模型是盒子的总宽度=内容区+外边距,，它和标准盒模型相反，它的内容区是包含填充区和边框的