zoukankan      html  css  js  c++  java
  • less常用方法

    最近在开发中使用了less,总结一下less一些常用的方法:

    1.可以定义变量
    SASS允许使用变量,所有变量以$开头。
    
    
      $blue : #1875e7; 
    
      div {
       color : $blue;
      }
    
    如果变量需要镶嵌在字符串之中,就必须需要写在#{}之中。
    
    
      $side : left;
    
      .rounded {
        border-#{$side}-radius: 5px;
      }
    
    2.可以嵌套
    SASS允许选择器嵌套。比如,下面的CSS代码:
    
    
      div h1 {
        color : red;
      }
    
    可以写成:
    
    
      div {
        hi {
          color:red;
        }
      }
    
    3,继承
    SASS允许一个选择器,继承另一个选择器。比如,现有class1:
    
    
      .class1 {
        border: 1px solid #ddd;
      }
    
    class2要继承class1,就要使用@extend命令:
    
    
      .class2 {
        @extend .class1;
        font-size:120%;
      }
    4.可以混入
    Mixin有点像C语言的宏(macro),是可以重用的代码块。
    
    使用@mixin命令,定义一个代码块。
    
    
      @mixin left {
        float: left;
        margin-left: 10px;
      }
    
    使用@include命令,调用这个mixin。
    
    
      div {
        @include left;
      }
    
    mixin的强大之处,在于可以指定参数和缺省值。
    
    
      @mixin left($value: 10px) {
        float: left;
        margin-right: $value;
      }
    
    使用的时候,根据需要加入参数:
    
    
      div {
        @include left(20px);
      }
    5.可以定义函数
    SASS允许用户编写自己的函数。
    
    
      @function double($n) {
        @return $n * 2;
      }
    
      #sidebar {
         double(5px);
      }
  • 相关阅读:
    关于大文件下载
    关于小文件下载
    小文件下载
    AppStore 中的app怎么样生成二维码,来提供下载
    重学STM32---(十)之CAN通信(二)
    重学STM32---(九)之CAN通信(一)
    将博客搬至CSDN
    绑定socket描述符到一个网络设备
    通用 Makefile(及makefile中的notdir,wildcard和patsubst)
    vsftpd 编译安装 及 隐藏版本号
  • 原文地址:https://www.cnblogs.com/lsy0403/p/7764846.html
Copyright © 2011-2022 走看看