
Sass/SCSS/compass
祥哥的说
精一技而绝天下。。。
展开
-
sass入门篇
第1章:Sass简介1-1.什么是 CSS 预处理器?“CSS 预处理器用一种专门的编程语言,进行 Web 页面样式设计,然后再编译成正常的 CSS 文件,以供项目使用。CSS 预处理器为 CSS 增加一些编程的特性,无需考虑浏览器的兼容性问题”,例如你可以在 CSS 中使用变量、简单的逻辑程序、函数等等在编程语言中的一些基本特性,可以让你的 CSS 更加简洁、适应性更强、可读性更佳,更易...原创 2018-10-17 19:23:33 · 848 阅读 · 0 评论 -
compass核心模块-utilities--Genral--float mixin的使用
"double-margin bug in IE5/6"是浮动领域一个经典的bug.This module provides mixins that help you work around the double-margin bug in IE5/6.This file can be imported using: @import "compass/utilities/general...原创 2018-11-21 21:13:10 · 238 阅读 · 0 评论 -
compass项目配置文件config.rb的设置与详解
compass项目配置文件config.rb当我们创建一个compass项目时,在项目文件里能看到两个文件夹和一个配置文件,如下图所示:在使用compass编译代码时,可能会遇到多余的注释,以及图片路径问题。对于刚接触compass的人来说非常苦恼,可能找了半天也没有解决问题,今天就来讲讲config.rb对代码输出效果的影响。第一次打开config.rb文件时是这样:先从...转载 2018-11-20 16:26:05 · 1107 阅读 · 0 评论 -
Invalid GBK character错误
问题描述在windows7上面,通过ruby编译scss时,发现编译报错,内容如下:Conversion error: Jekyll::Converters::Scss encountered an error while converting 'css/main.scss': Invalid GBK character "\xE3" o...转载 2018-11-15 21:34:16 · 1244 阅读 · 0 评论 -
Sass和css中@import的区别,以及如何在sass中还使用css的@import
1、CSS中原生的@import指令两大弊端(1)需要放在代码最前边(2)对性能不利,容易造成渲染阻塞2、原创 2018-11-15 21:27:46 · 4672 阅读 · 0 评论 -
compass的安装及使用,以及常见命令行指令与注意事项、Compass核心模块
1、compass官网:compass-style.orgcompass是一个开源的书写框架正确安装完ruby之后,使用gem install compass安装1、compass create learn-compass-init:通过compass直接创建一个compass框架项目2、@import “compass/reset”:compass 内置浏览器重置样式模块2、...原创 2018-11-15 21:27:22 · 6086 阅读 · 0 评论 -
常见的sass命令行指令
1、sass main.scss main.css:将scss文件转换为css文件2、sass-convert main.scss main.sass:将scss格式转换为sass格式原创 2018-11-15 19:29:49 · 1676 阅读 · 0 评论 -
window环境下Ruby和Sass的最新安装步骤详解
步骤一:进入ruby的官网https://rubyinstaller.org/,界面展示如下:点击Download,进入下载页面步骤二:根据自己的电脑配置选择相应的ruby安装包进行下载,我的电脑是win7,64位的,根据右侧英文文档第一项的推荐,选择了=》Ruby+Devkit2.5.3-1(x64)步骤三:Ruby 安装文件下载好后,可以按应用软件安装步骤进行安装 Ruby...原创 2018-11-13 17:07:26 · 418 阅读 · 0 评论 -
Sass进阶篇
第一章:Sass的控制命令1-2.@if@if 指令是一个 SassScript,它可以根据条件来处理样式块,如果条件为 true 返回一个样式块,反之 false 返回另一个样式块。在 Sass 中除了 @if 之,还可以配合 @else if 和 @else 一起使用。假设要控制一个元素隐藏或显示,我们就可以定义一个混合宏,通过 @if...@else... 来判断传进参数的值来控...原创 2018-11-01 13:32:11 · 641 阅读 · 0 评论 -
Sass中的嵌套---结合在线编译详解选择器嵌套、属性嵌套、伪类嵌套
推荐博客:https://blog.hypers.io/2017/08/06/sass%20&%20compass%20%E6%95%99%E7%A8%8B%20--%20%E8%AF%AD%E6%B3%95%E7%AF%87(%E4%B8%80)/?utm_source=tuicool&utm_medium=referral1.选择器嵌套Sass 的嵌套分为三种:选择...转载 2018-10-27 21:54:43 · 754 阅读 · 0 评论 -
超炫的进度条加载效果
红灰色调进度条 详情请使劲戳我,然后戳小星星!!! 动画在线编辑地址...原创 2018-11-20 13:06:35 · 571 阅读 · 0 评论