较少的文件不会生成 Twitter Bootstrap 响应式 css [英] Twitter Bootstrap responsive css is not generated form the less files

问题描述

我已经从 download with docs 链接下载了 .less 文件，我已将其添加到我的项目中.我已经下载了 less.js 并将其添加到我的项目中.如果我在页面的头部包含以下内容:

I've downloaded the .less files from the download with docs link and I have added it to my project. I've alo downloaded less.js and added it to my project. If I include the following in the head of a page:

<link rel="stylesheet/less" href="@routes.Assets.at("less/bootstrap.less")">
    <script src="@routes.Assets.at("less/less-1.3.0.min.js")"></script>

引导程序似乎工作，减去响应部分(即如果浏览器窗口变得太窄，导航栏不会折叠).我可以通过手动添加 bootstrap-responsive.css 来解决这个问题

The bootstrap seems to work, minus the responsive part (i.e. the navbar won't collapse if the browser window becomes too narrow). I can fix this by manually adding bootstrap-responsive.css

<link rel="stylesheet" href="@routes.Assets.at("stylesheets/bootstrap-responsive.css")" />

问题是如果我想修改我页面的颜色主题，需要在bootstrap-responsive.css中编辑颜色值，很痛苦.看起来一些 .less 文件是为了生成 bootstrap-responsive.css(例如responsive-navabar.less)，但它们不起作用.

The problem is that if I want to modify the color theme of my page, I need to edit the color values in bootstrap-responsive.css, which is a pain. It looks like some of the .less files were meant to generate bootstrap-responsive.css (for example responsive-navabar.less), but they aren't working.

关于如何从 .less 文件中获取 bootstrap-responsive.css 文件的任何建议?

Any advice on how I can get the bootstrap-responsive.css file from the .less files?

推荐答案

您还需要明确包含此文件:

You need to explicitly include also this file:

responsive.less

假设您使用的是 Twitter Bootstrap 的最新版本 (2.0.x).

Assuming you are using recent version (2.0.x) of Twitter Bootstrap.

如他们网站上所述(http://twitter.github.com/bootstrap/scaffolding.html#responsive):

As mentioned on their website (http://twitter.github.com/bootstrap/scaffolding.html#responsive):

Bootstrap 不会自动包含这些媒体查询，但理解和添加它们非常容易，并且需要最少的设置.您有几个选项可以包含 Bootstrap 的响应式功能:

Bootstrap doesn't automatically include these media queries, but understanding and adding them is very easy and requires minimal setup. You have a few options for including the responsive features of Bootstrap:

1. 使用编译后的响应式版本 bootstrap-responsive.css
2. 添加@importresponsive.less"；并重新编译 Bootstrap
3. 将responsive.less 修改并重新编译为一个单独的文件

为什么不包括它?说实话，并非所有事情都需要响应.我们认为最好启用它，而不是鼓励开发者删除此功能.

Why not just include it? Truth be told, not everything needs to be responsive. Instead of encouraging developers to remove this feature, we figure it best to enable it.

这篇关于较少的文件不会生成 Twitter Bootstrap 响应式 css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！