前端面试题之 CSS3

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)

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

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