首页 > 其他 > 详细

stylus样式开发的使用----vue

时间:2019-09-03 15:15:46      阅读:92      评论:0      收藏:0      [点我收藏+]

stylus是css开发辅助工具,类似lLess和Sass,安装成功后的使用如下图所示

使用的时候要特别注意缩进,因为缩进是页面dom的父子关系或者兄弟关系的体现,如图font-size:0.4rem可以理解为.header类下的.header-left类下的.text-align类
的font-size为0.4rem。而且较平常使用的css相比可以不写{}和属性后的;。这样代码更简洁易读,同样stylus也可以像Less、Sass一样使用变量

技术分享图片

 

 

 一、安装

通过终端打开项目所在的文件夹,使用cnpm的前提是安装了淘宝镜像,否则使用npm,

1、安装 stylus,输入命令:cnpm install stylus --save

2、安装stylus-loader,输入命令cnpm install stylus-loader --save

3、启动项目,输入命令:npm run dev

二、引入

在要使用的文件style标签下面引入stylus

输入:@import ‘~styles/varibles.styl‘

至此,stylus的安装和使用已经完成。

 

stylus样式开发的使用----vue

原文:https://www.cnblogs.com/qdkfyym/p/11453128.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!