安装步骤

  • cnpm install stylus --save-dev
  • cnpm install stylus-loader --save-dev

写法如下:

<style lang="stylus">
.goods
display flex
position absolute
top 174px
bottom 46px
width 100%
overflow hidden
.menu-wrapper
flex 0 0 80px
width 80px
background #f3f5f7
margin-top: 2px;
.menu-item-selected
background white
font-weight 700
margin-top -1px
</style>

  

参考文档:http://www.mamicode.com/info-detail-1863165.html

stylus教程:http://www.zhangxinxu.com/jq/stylus/functions.php

vue中使用stylus编写css的更多相关文章

  1. 在vue 中使用Stylus

    概述 什么是Stylus Stylus是一个CSS预处理器. 什么是CSS预处理器 关于CSS预处理器,推荐先行阅读这篇文章:为您详细比较三个 CSS 预处理器(框架):Sass.LESS 和 Sty ...

  2. vue中全局引入bootstrap.css

    1.首先在官网上下载bootstrap的压缩包(必须是官网上下载的) 将压缩包解压后引入在项目文件夹下面.如下图所示: 2.在main.js中引入 import './assets/bootstrap ...

  3. vue 中如何对公共css、 js 方法进行单文件统一管理,全局调用

    1.前言 最近,为公司开发交付的一个后台管理系统项目,我使用了 Vue 框架进行开发实践. 模块化.组件化.工程化的开发体验非常好.良好的 api,优雅的设计,对于工程师非常友好. 但是由于模块比较多 ...

  4. vue中使用stylus

    1.创建完成一个初始项目后,通过 npm install stylus -D命令,在项目内安装stylus.(注意:命令结尾 -D 即是 --save-dev 的简写形式) 2.需要安装loader, ...

  5. vue中设置全局的css样式

    只需在main.js    ====import './style.less'   main.js =>>   import Vue from 'vue' import App from ...

  6. 在vue中使用css预编辑器

    vue中使用less 安装less依赖,npm install less less-loader --save vue中使用sass npm install --save-dev sass-loade ...

  7. stylus入门教程,在webstorm中配置stylus

    转载:https://www.cnblogs.com/wenqiangit/p/9717715.html#undefined   stylus特点 富于表现力.具有健壮性.功能丰富.动态编码 不需要写 ...

  8. Vue基础系列(四)——Vue中的指令(上)

    写在前面的话: 文章是个人学习过程中的总结,为方便以后回头在学习. 文章中会参考官方文档和其他的一些文章,示例均为亲自编写和实践,若有写的不对的地方欢迎大家和我一起交流. VUE基础系列目录 < ...

  9. Vue 中的动画特效

    Vue 中的动画特效 CSS 实现标签显隐 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

随机推荐

  1. MySQL查看数据表的创建时间和最后修改时间

    如何MySQL中一个数据表的创建时间和最后修改时间呢? 可以通过查询information_schema.TABLES 表得到信息. 例如 mysql> SELECT * FROM `infor ...

  2. OpenCV学习笔记(7)——图像阈值

    简单阈值,自适应阈值,Otsu's二值化等 1.简单阈值 当像素值高于阈值时,我们给这个像素赋予一个新值,否则给他赋予另一个值.这个函数就是cv2.threshhold().这个函数的第一个参数就是原 ...

  3. 找回从pycharm中删除的文件及文件夹

  4. Selenium 2自动化测试实战5(模块调用)

    一.模块调用 1.创建一个目录project,并且在目录下面创建两个文件 project/ 一 pub.py L一 count.py 在pub.py文件中创建add函数. #pub.py def ad ...

  5. 阶段3 2.Spring_06.Spring的新注解_5 spring的新注解-PropertySource

    数据库的链接 次数是写死的 新建配置文件 定义成员变量 value注解实现 与配置文件的key对应 PropertySource 要想让spring去读取这个配置文件 resource编译后都跑到了. ...

  6. Linux监控命令之==>lsof

    一.命令说明 lsof 命令的原始功能是列出打开的文件的进程,但LINUX 下,所有的设备都是以文件的行式存在的,所以,lsof 的功能很强大. 二.参数说明 -a :列出打开文件存在的进程 -c&l ...

  7. harbor报错解决

    1. [root@host-10-1-1-71 harbor]# docker login 10.1.1.71:5000Username (admin): Password: Error respon ...

  8. LeetCode.914-一副牌中的X(X of a Kind in a Deck of Cards)

    这是悦乐书的第352次更新,第377篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第214题(顺位题号是914).在一副牌中,每张牌上都写有一个整数. 当且仅当您可以选择 ...

  9. 手写BP(反向传播)算法

    BP算法为深度学习中参数更新的重要角色,一般基于loss对参数的偏导进行更新. 一些根据均方误差,每层默认激活函数sigmoid(不同激活函数,则更新公式不一样) 假设网络如图所示: 则更新公式为: ...

  10. 【神经网络与深度学习】leveldb的实现原理

    郑重声明:本篇博客是自己学习 Leveldb 实现原理时参考了郎格科技系列博客整理的,原文地址:http://www.samecity.com/blog/Index.asp?SortID=12,只是为 ...