css - 如何在 Flask 应用程序中修改 Bootstrap LESS 变量?

标签 css twitter-bootstrap flask sass less

我正在使用 Flask 制作一个静态网站,并使用 flask-bootstrap 扩展来简化前端开发。我同时一直在学习 Rails,所以我知道其中有一些语言可以编译成 CSS(LESS/SASS/SCSS)。据我了解,Bootstrap 默认使用 LESS,在我的 Rails 应用程序中,我必须将 LESS 变量(开头带有 @ 符号)转换为 SCSS 变量(带有 $)。这不是太难,没问题。

我注意到在 Miguel Grinberg 的教程(Flask Web Development,O'Reilly)中使用了 Bootstrap(Flask-Bootstrap 扩展),并且简要提到了 {% block styles %} 用于以这种方式包含样式表,我很困惑如何修改 Bootstrap 默认提供的现有 LESS 变量,以便我可以修改网格结构,而不会弄乱我自己的自定义样式表。例如,我希望能够修改@body-bg LESS 变量,或此处的任何变量:http://getbootstrap.com/customize

最佳答案

这是一个非常有趣的问题。我对动态创建样式也很感兴趣。您需要遵循其他方式。按照您上面描述的方式,这是不可能的。

你提到你使用了 Flask-Bootstrap。本扩展采用 Flask 元素使用 Twitter Bootstrap 样式。我不喜欢任何 SASS/LESS 功能。
http://pythonhosted.org/Flask-Bootstrap/#
https://github.com/mbr/flask-bootstrap

如果您查看扩展的静态文件夹,您将找不到任何 SASS/LESS 轨道。

据我所知,Twitter Bootstrap 是由 LESS 生成的。还有一个 SASS 前叉。您重新生成样式并在 Flask-Bootstrap 元素的静态文件夹中替换它们。

如果要动态执行此操作,则需要创建自己的解决方案。我不知道一个现成的扩展。这是一项非常具有挑战性的任务。

关于css - 如何在 Flask 应用程序中修改 Bootstrap LESS 变量?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25578547/

相关文章:

javascript - 谷歌地图不会在 div 容器中显示整个 map

javascript - 什么会导致 scrollTop 出现故障?

request - flask:wsgi-middleware与before_和after_request()

python - 如何使日志处理程序记录到flask-socketio

CSS 过渡比例/不透明度悬停兼容性

HTML & CSS 注释列表

javascript - 具有绝对位置的CSS旋转

javascript - 使用 Bootstrap 启动时出现多个错误

asp.net-mvc-4 - Twitter bootstrap 3 - MVC razor View 中的文本输入隐藏了前几个字符

Python 3.6.3 : Multiple "Exception ignored in: <generator object..." in flask app