zoukankan      html  css  js  c++  java
  • 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;
    }
  • 相关阅读:
    tomcat 添加用户名和密码
    linux系统下获取cpu、硬盘、内存使用率
    snmp 企业对应的mib编号
    String加密解密 2017.07.26
    Mongo日期
    linux sed 批量替换多个文件中的字符串
    Python和giL的关系
    vim
    乌班图
    Python
  • 原文地址:https://www.cnblogs.com/yaowen/p/6998721.html
Copyright © 2011-2022 走看看