Question

我正在考虑在我的Bootstrap编辑器（Bootply.com）中集成LESS以符合Bootstrap customization best practices，并支持mixins。

但是，我还没有确定使用LESS而不是简单CSS覆盖的特定优势（性能和其他方面）。似乎最终LESS被编译为CSS。似乎LESS将引入更多的维护/重新编译任务，因为引入了新版本的Bootstrap。

我知道可以在'bootstrap.css'之后使用自定义'theme.css'来完成Bootstrap自定义。所以，如果你想改变.navbar颜色，我会在'theme.css'中添加几行代码..

.navbar-custom .navbar-inner {
   background-color:#444444;
}

然后标记看起来像：

<div class="navbar navbar-custom navbar-fixed-top">..

如果这不是定制的最佳做法，那么LESS如何改进呢？

Answer 1

很少像这样摘录CSS混乱：

background: #45484d; /* Old browsers */
background: -moz-linear-gradient(top,  #45484d 0%, #000000 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #45484d 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #45484d 0%,#000000 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #45484d 0%,#000000 100%); /* IE10+ */
background: linear-gradient(to bottom,  #45484d 0%,#000000 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

在您的情况下，导航栏具有渐变，因此您无法简单地更改背景颜色。如果您使用LESS，您可以选择两种颜色，并且在Bootstrap的CSS文件中的某处，看起来像上面的混乱将会自动更新。

Bootstrap Customization：我为什么要使用LESS？

1 个答案: