zoukankan      html  css  js  c++  java
  • sass-笔记

    使用$符号来标识变量 例如:$color: #F90;

    子组合选择器>

    同层相邻组合选择器+

    同层全体组合选择器~

     

    优势

    1.无需重复书写属性值,对于有可能在项目中多次使用的属性值,可以通过声明一个公共变量去管理,这种只写一遍群组选择器大大减少了工作量

     

    弊端

    1.群组选择器的规则嵌套生成的css。虽然sass让你的样式表看上去很小,但实际生成的css却可能非常大,这会降低网站的速度。

    2.@import 允许在一个css文件中导入其他css文件,然而,后果是只有执行到@import时,浏览器才会去下载其他css文件,这导致页面加载起来特别慢。

     

    安装:

    npm install  sass-loader --save-dev

    npm install  node-sass --save-dev

    如果报错,

    npm uninstall sass-loader(卸载当前版本)

    npm install sass-loader@7.3.1 --save-dev    (安装指定版本)

     

    build文件夹下的webpack.base.conf.jsrules里面添加配置

    {

      test: /.sass$/,

      loaders: ['style', 'css', 'sass']

    }

     

    修改style标签:<style lang="scss">

     
    但行好事,莫问前程。
  • 相关阅读:
    git 同步远程分支
    git tag 打标签
    EJS 语法
    从零开始制作 Hexo 主题
    博客灵感
    java编译做了哪些事?
    java+内存分配及变量存储位置的区别[转]
    用android模拟器Genymotion定位元素
    利用securecrt在linux与windows之间传输文件
    eclipse引入tomcat
  • 原文地址:https://www.cnblogs.com/txhy/p/10638473.html
Copyright © 2011-2022 走看看