创新互联less教程：Less导入

描述

它用于导入LESS或CSS文件的内容。

创新互联是一家专业提供大石桥企业网站建设,专注与成都网站建设、成都做网站、H5高端网站建设、小程序制作等业务。10年已为大石桥众多企业、政府机构等服务。创新互联专业网络公司优惠进行中。

例子

下面的例子演示了在LESS文件中使用导入:



   Less Importing
   


   Example using Importing
   LESS enables customizable, manageable and reusable style sheet for web site.
   It allows reusing CSS code and writing LESS code with same semantics.
   LESS supports creating cleaner, cross-browser friendly CSS faster and easier.

接下来，创建文件 myfile.less 。

myfile.less

.myclass{
    color: #FF8000;
}

.myclass1{
    color: #5882FA;
}

接下来，创建文件 style.less 。

style.less

@import "//www.w3cschool.cn/less/myfile.less";
.myclass2
{
color: #FF0000;
}

将路径从 style.less 的 myfile.less “> //www.w3cschool.cn/less/myfile.less

您可以使用以下命令将 style.less 文件编译为 style.css :

lessc style.less style.css

接下来执行上面的命令，它将用下面的代码自动创建 style.css 文件:

style.css

.myclass {
  color: #FF8000;
}
.myclass1 {
  color: #5882FA;
}
.myclass2 {
  color: #FF0000;
}

输出

让我们执行以下步骤，看看上面的代码如何工作:

将上述html代码保存在 importing.html 文件中。
在浏览器中打开此HTML文件，将显示如下输出。

新闻名称：创新互联less教程：Less导入
标题路径：http://www.shufengxianlan.com/qtweb/news12/31062.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容