• Campass + Scss ,让我们更优雅的编写CSS


    如果你经常写CSS,你应该会发现传统的CSS编写方式或多或少有些枯燥,不智能? 不优雅? 至少我是这么认为的。

    缺陷举例

    1. 假设页面中有大部分HTML元素的背景颜色值是一样的,  我们就需要为各个元素加上 background-color:#fff 这样重复的CSS代码,当然,你也可以通过单独定义一个class, 为这个class设定 background-color:#fff, 然后把class应用到你想要到的HTML元素上,如果运用的合理,还算说的过去,否则结果就是你的HTML元素上面可能有很多个class, 在我看来这个很丑陋.

    2. 假设你的HTML元素有好多层, 你需要为每层编写一些CSS, 结果可能会是

        .div1{ 800px;}

        .div1 .div1-1{ 600px;}

        .div1 .div1-1 .div1-1-1{400px;}

        .div1 .div1-1 .div1-1-1 .div1-1-1-1{ 200px; }

        写到第四层, 我就已经感到有点枯燥了,因为我要重复的去把父元素包含进去, 而且后期也很不好维护

    正因为现在的传统方式有种种的缺陷,所以诞生了scss, 参照官网 http://sass-lang.com/ 查看详细的介绍,简单的说,这个就是个编写CSS的框架,通过约定的语法来更智能的编写CSS

    使用

    1. 因为要依赖于ruby环境,所以如果你用的是Windows系统, 首先请下载 RubyInstaller,, http://www.rubyinstaller.org/

    2. 安装完后, 如果你是win 8系统,请通过搜索并运行 'command prompt with Ruby'

    3. 命令输入 gem install compass , 表示要安装 compass 框架, compass是个很方便的编写CSS的框架, 稍后再介绍,有兴趣请参见官网 http://compass-style.org/

  • 相关阅读:
    nuget 命令行小技巧
    非静态类、方法、属性要实例化对象
    ViewData 和 ViewBag
    每日记载内容总结32
    每日记载内容总结31
    hibernate 学习知识总结
    spring mvc 页面编码和数据库编码 中文出现乱码
    java代码生成二维码以及解析二维码
    每日记载内容总结30
    换公司,重新开始
  • 原文地址:https://www.cnblogs.com/_dragon/p/3811187.html
Copyright © 2020-2023  润新知