BootStrap2学习日记2--将固定布局换成响应式布局

时间:2022-12-01 14:39:35

概要:响应式页面是指页面根据浏览平台(尺寸)的不同显示不同的CSS。

原理:在Html的的头加入代码

<style>

  /*当浏览器宽度大于767是 采用括号里面的CSS样式*/

  @media(min-width:767px){body(background:red)}

  /*当浏览器宽度小于767px的时候采用 */

  @media(max-width:767px){body(background:red}

  /*当浏览器宽度大约767px小于960px的时候采用 */

  @media(min-width:767px) and (max-width:960px){body(background:red)}

</style>

在BootStrap2中要把固定布局转换成响应式布局只需要在其中倒入bootstrap-responsive.css样式即可