Bootstrap页面布局7 - Bootstrap响应式布局的实用类

在bootstrap-responsive.css这个CSS样式表中已经为我们设定好了几个实用的类:

  .visible-phone:

     在智能手机设备上显示这个元素,在其他设备上隐藏该元素

  .visible-tablet:

     在平板电脑上显示这个元素,在其他设备上隐藏该元素

  .visible-desktop:

     在桌面电脑上显示这个元素,在其他设备上隐藏该元素

  .hidden-phone:

    在智能手机上隐藏,在其他设备上显示该元素

  .hidden-tablet:

    在平板电脑上隐藏,在其他设备上显示该元素

  .hidden-desktop:

    在桌面电脑上隐藏,在其他设备上显示该元素

 

  测试(略):

    先引入bootstrap-responsive.css文件

    然后再测试的元素上应用以上的类,通过调整浏览窗口的大小来测试!

posted @ 2014-07-30 11:04  Zell~Dincht  阅读(379)  评论(0编辑  收藏  举报