zoukankan      html  css  js  c++  java
  • 移动 web 开发之less

    Less 使用之变量

    变量是指没有固定的值,可以改变的。因为我们CSS中的一些颜色和数值等经常使用。

    @变量名:值;
    • 必须有@为前缀

    • 不能包含特殊字符

    • 不能以数字开头

    • 大小写敏感

    @color: pink;

    Less 嵌套

    // 将css改为less
    #header .logo {
       300px;
    }
    ​
    #header {
        .logo {
            300px;
        }
    }

    如果遇见 (交集|伪类|伪元素选择器) ,利用&进行连接

    a:hover{
        color:red;
    }
    a{
      &:hover{
          color:red;
      }
    }
    

      

    Less 运算

    任何数字、颜色或者变量都可以参与运算。就是Less提供了加(+)、减(-)、乘(*)、除(/)算术运算。

    /*Less 里面写*/
    @witdh: 10px + 5;
    div {
        border: @witdh solid red;
    }
    /*生成的css*/
    div {
      border: 15px solid red;
    }
    /*Less 甚至还可以这样 */
     (@width + 5) * 2;
    ​
    • 乘号(*)和除号(/)的写法

    • 运算符中间左右有个空格隔开 1px + 5

    • 对于两个不同的单位的值之间的运算,运算结果的值取第一个值的单位

    • 如果两个值之间只有一个值有单位,则运算结果就取该单位

     

  • 相关阅读:
    图片处理连环画特效
    卡片翻页算法
    android 自定义属性
    android 中捕获全局异常
    c++ 学习笔记
    图片怀旧特效处理
    Linux 网络配置
    指针参数传递
    python 读写文件
    PopupWindow 点击外面取消
  • 原文地址:https://www.cnblogs.com/showlgfcode/p/13698262.html
Copyright © 2011-2022 走看看