116.响应式布局-媒体查询

• 响应式布局
  • 网页可以根据不同的设备或窗口，呈现不同的效果
  • 使用响应布局，可以使一个网页适用于所有设备
  • 关键
    • 媒体查询
• 使用媒体查询
  • 语法
    • @media 查询规则 { }
      • 媒体类型 all 所有设备

print 打印设备
screen 带屏幕的设备
speech 屏幕阅读器

     - 例：**@media   print,screen{**

body{
background-color:#bfa;
}
}