响应式布局(Responsive Web Design)

响应式布局是指，网页可以自动识别设备屏幕宽度，根据不同的宽度采用不同的CSS的样式，从而达到兼容各种设备的效果。响应式布局使用媒体查询(CSS3 Media Queries), 根据不同屏幕分辨率采用不同CSS规则, 使用方式如下:

@media screen and (max-width:1024px) {
  /* 视窗宽度小于1024px时 */
  ....
}