如何覆盖Twitter Bootstrap 2中的响应功能2

How to override responsive features in Twitter Bootstrap 2?

本文关键字：响应 功能 Bootstrap Twitter 何覆盖 覆盖      更新时间：2023-09-26

我有一个使用twitter引导程序的网站，并且正在使用一些响应功能。它在桌面和移动设备上运行良好。缩小我在桌面上的窗口会导致响应网格启动，并且响应网格会适当地提供给移动设备。

然而，iPhone用户有可能访问"无响应"版本吗？iPhone和android手机访问大多数网站的"完整"版本通常是安全的，所以我想为移动用户提供一个选项。

在"响应"成为最热门的事情之前，这通常是通过客户端浏览器检测来处理的，后端将客户端路由到两个完全不同的网站、页面或主题来呈现内容，通常会为用户提供某种链接或按钮，允许他们访问完整的网站。我正试图复制这种使用模式。

如果您不想在更改为"桌面"版本后重新加载页面，可以尝试禁用替代样式表。请参阅：用JavaScript/jQuery和https://stackoverflow.com/a/15824131/1596547.删除样式表似乎也能起作用。

删除响应样式表的一些概念验证：

css：

<link href="bootstrap-responsive.css" rel="stylesheet" id="responsivecss">

javascript:

    var responsivecss = true;
    $('#switch').click(

    function ()
        {
            if(responsivecss)
            {
        $('#responsivecss').remove();
      $(this).text('Mobile version');           
              responsivecss = false;
            }
            else
            {
      $('head').append('<link href="bootstrap-responsive.css" rel="stylesheet" id="responsivecss">');
      $(this).text('Desktop version');
                responsivecss = true;
            }       

        }
    );

试试看：http://plnkr.co/LdOUquuYPMnOOd5UrBtZ

Twitter的Bootstrap 3

TB3没有单独的响应CSS文件。要做到这一点，您必须创建一个没有响应功能的css文件（请参阅：http://bassjobsen.weblogs.fm/compile-twitters-bootstrap-3-without-responsive-features/)点击切换这些文件。

相关文章：