• sass05 数据类型,数据运算


    /*! 数字类型 */
    $n1: 1.2;
    $n2: 12;
    $n3: 14px;
    
    p{
      font-size: $n3;
    }
    
    /*! 字符串类型*/
    $s1: container;
    $s2: 'container';
    $s3: "container";
    
    .#{$s3}{
      font-size: $n3;
    }
    
    /*! Bool类型*/
    $bt: ture;
    $bf: false;
    
    /*! Null类型*/
    $null: null;
    
    body{
      @if $null == null{
        color: red;
      }
    }
    
    /*! 颜色类型*/
    $c1: blue;
    $c2: #fff;
    $c3: rgba(255,255,0,0.5);
    
    body{
      color: $c3;
    }
    
    $width1: 10px;
    $width2: 15px;
    
    /*== !=所有数据类型都支持,<,>,<=,>=仅仅支持数字类型,*/
    
    span{
      width: $width1 - $width2; //空格隔开,不隔开会报错
    }
    
    a:hover{
      cursor: e + -resize; //e-resize是标准做法
    }
    
    a:before{
      content: "A" + bc;//"Abc",第一个有单引号双引号结果就有单引号双引号
    }
    a:before{
      content: A + 'bc';// Abc,第一个没有单引号双引号结果就没有单引号双引号
    }
    
    p{
      padding: 3px + 4px auto; 
    }
    
    $version: 3;
    p:before{
      content: 'Hello,Sass #{$version}';
    }
    
    p{
      font: 20px / 10px;    //运算符最好空格隔开
      width: $width2 / 2;     
      width: round($width2) / 2;
      height: (100px / 2);            //不写小括号不能运算
    }
    @charset "UTF-8";
    /*! 数字类型 */
    /* line 6, ../sass/demo1.scss */
    p {
      font-size: 14px;
    }
    
    /*! 字符串类型*/
    /* line 15, ../sass/demo1.scss */
    .container {
      font-size: 14px;
    }
    
    /*! Bool类型*/
    /*! Null类型*/
    /* line 26, ../sass/demo1.scss */
    body {
      color: red;
    }
    
    /*! 颜色类型*/
    /* line 37, ../sass/demo1.scss */
    body {
      color: rgba(255, 255, 0, 0.5);
    }
    
    /* line 44, ../sass/demo1.scss */
    span {
      width: -5px;
    }
    
    /* line 48, ../sass/demo1.scss */
    a:hover {
      cursor: e-resize;
    }
    
    /* line 52, ../sass/demo1.scss */
    a:before {
      content: "Abc";
    }
    
    /* line 55, ../sass/demo1.scss */
    a:before {
      content: Abc;
    }
    
    /* line 59, ../sass/demo1.scss */
    p {
      padding: 7px auto;
    }
    
    /* line 63, ../sass/demo1.scss */
    p:before {
      content: "Hello,Sass 3";
    }
    
    /* line 67, ../sass/demo1.scss */
    p {
      font: 20px / 10px;
      width: 7.5px;
      width: 7.5px;
      height: 50px;
    }
  • 相关阅读:
    MySQL Error 1170 (42000): BLOB/TEXT Column Used in Key Specification Without a Key Length
    递归枚举IHTMLDocument2的所有元素
    递归创建文件和文件夹
    通过ARP协议获取MAC地址
    监控文件(夹)的改变
    ATL和MFC的C++类和HWND的映射机制
    枚举当前环境中打开的所有IE
    封装字符串的Format操作
    python decimal和fractions模块
    解决Output Designer字体问题
  • 原文地址:https://www.cnblogs.com/yaowen/p/6998721.html
Copyright © 2020-2023  润新知