Question

问题

好的，所以我试图使用LESS来允许名为bootstrap.min.css的CSS仅应用于我的代码的一部分。正如我在全球范围内应用它时，它会用我的造型拧紧。

当前实施

我的.less在标题
中定义

<head>

    <link href="Boot.less" rel="stylesheet/less" type="text/css">

</head>

Boot.less的内容

#bootbox
{
 @import (css) "bootstrap.min.css";
}

身体用法

 <div id="bootbox"> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> 
<script src="bootstrap.min.js"></script>
<script src="bootbox.min.js"></script>
<script src="less-1.7.0.min.js" type="text/javascript"></script>
<script>

 $('#form1').submit(function(e) {
        var currentForm = this;
        e.preventDefault();
        bootbox.confirm("Are you sure?", function(result) {
            if (result) {
                currentForm.submit();
            }
        });
    });

</script>



   </div>

这怎么可能不会将bootstrap.min.css应用于div id“bootbox”中的所有内容。

我做错了什么或者我对整件事情做错了吗？

Answer 1

使用F12工具查看页面上生成的CSS ...

您可以将CSS文件视为LESS

#bootbox
{
 @import (less) "bootstrap.min.css";
}

如果您要导入.LESS文件，它也会在LESS编译期间为您提供所需的结果。

#bootbox
{
 @import "bootstrap.less";
}

这是LESS的正确实现吗？

1 个答案: