第三课响应式布局

Posted 2020-09-02

响应式布局介绍

1.响应式布局：

    响应式布局是2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。其目的是为用户提供更加舒适的界而和更好的用户体验

2.优缺点：

优点：1）面对不同分辩率设备灵活性强

       2）能够快捷解决多设备显示适应问题

缺点：1）兼容各种设备工作量大，效率低下

 2）代码累赘，会出现隐藏无用的元素，加载时间加长

2.响应式布局基本实现

1.css中的Media Query（媒介查询）：

设备宽高：device-width,device-height

渲染窗口的宽和高：width,height

设备的手持方向：orientation

设备的分辩率：resolution

2.使用方法：

外联

内嵌样式

Bootstrap