zoukankan      html  css  js  c++  java
  • stylus的使用-变量和函数

    stylus个人通俗一点认为就是css的框架,可以简化css代码的书写,和支持一些模块化的使用方式!

    base.stylu文件中:
    RemoveDefault()
        appearance: none
        border:none
        outline: none
    $red = rgb(255,69,0) //定义$red 在引入base.styl的其他styl 中直接使用$red 即可! //base.styl这个 styl文件中定义了一个函数RemoveDefault() 里面封装了一些常用样式。 当在其他styl文件或者 Vue的lang=“stylus” 的script中,使用 @import 'base.styl', 然后直接 使用 RemoveDefaul()就相当于书写上面三个样式!!!
    ex: 1.styl 中: @import 'base.styl' .main RemoveDefault() //直接使用函数 color:#ccc font-size:14px
    带参数的函数的使用
    test(c,border = false)
        if( border == true )
            border 1px solid c
        else 
            background-color:#FFA500
    
    usetest() //其他styl 通过函数中转调用还是 直接传参调用test()都可!
        test(red,true)

    css框架极大的提高了css代码的复用性,可以把一类好看的组件样式抽离为一个文件,后续用到直接引入文件调用函数即可!!!

  • 相关阅读:
    Android中库项目、jar包等的使用方法
    rman 使用catalog备份的演示
    好端端的项目重新运行的时候却不行了!!!已解决
    动物:河蚌
    动物:田螺
    动物-鱼:鳖
    动物-鱼:鳝鱼
    动物-鱼:柳根鱼
    动物-鱼:泥鳅
    动物-鱼:刺鳅
  • 原文地址:https://www.cnblogs.com/Hijacku/p/14765074.html
Copyright © 2011-2022 走看看