关于CSS预处理器(less,sass)
在接触到SASS这个词汇时,是在13年,大漠的w3cplus上看到的,那时我还是名UI设计师,做设计为主,偶尔工作需要也写代码的。所以对于SASS没有太多关注。
重视起想要学习LESS,SASS是在今年五月,找工作的时候发现有公司职位需求有要会的。所以呢。学习LESS,SASS就在学习计划中了。
我很建议会CSS的人去学习一下LESS或SASS,它们二个之间有很多共通点,特别容易入门,等我看了一些视频学习了之后,有一种相见恨晚的感觉,因为很容易理解和学习。并且能真正的能提高工作效率。
LESS和SASS
主要区别是他们的实现方式不同,LESS是基于JavaScript运行,所以LESS是在客户端处理。
另一方面,Sass是基于Ruby的,是在服务器端处理的。很多开发者不选择LESS是因为LESS输出修改过的CSS到浏览器需要依赖于Javascript引擎,而Javascript引擎需要额外的时间来处理代码。关于这个有很多种方式,我选择的是只在开发环节使用LESS。一旦开发完成,我就复制粘贴LESS输出的到一个压缩器,然后到一个单独的CSS文件来替代LESS文件。另一种方式是使用LESS APP来编译和压缩你的LESS文件。两种方式都将是最小化你的样式输出,从而避免由于用户的浏览器不支持Javascript而可能引起的任何问题。尽管这不大可能,但终归是有可能的。
SASS和SCSS
SASS技术的文件的后缀名有两种形式:.sass和.scss。这两种的区别在于.sass文件对代码的排版有着非常严格的要求,而且没有大括号。
.scss的文件代码和CSS相近,用了LESS再用.scss明显的区别就是用的是$ 和@ 做变量。(建议使用.SCSS,我在看博文的时候也有看到喜欢用.SASS的,原因是:不需要{ 更接近ruby python 编程风格)
最后的话
最近一直在找资料学习补充自己。做web前端,发现要学的太多了。 简单说是html5,css3,js。还涉及到很多东西,光说JS框架现在流行的就非常非常多了。
一直在想时间怎么安排比较合适呢?先学什么呢? 应该做个计划什么的,但计划还未做好。目前还是属于先是拿起什么先看看,总比坐着什么也不学的好点。
转载于:https://www.cnblogs.com/maixi/p/4613077.html
关于CSS预处理器(less,sass)相关推荐
- 初识css预处理器:Sass、LESS
这篇文章是初步介绍css预处理的,详细学习请移步官网~ sass中文文档:https://www.sass.hk/docs less中文文档:http://lesscss.cn/ 什么是css预处理器 ...
- 009 - CSS预处理器less sass SAML SSO 单点登录 websocket socket.io
009_css预处理器less sass saml sso 单点登录 websocket## less 安装: npm install -g less 命令: lessc style.less sty ...
- css 预处理器 less sass
文章目录 1. less 1.1 less 的安装 1.2 less用法 1.2.1 命令行用法 1.2.2 变量 1.2.3 混合 1.2.4 嵌套 2. Sass 2.1 Sass简介 2.1.1 ...
- css预处理器:Sass LASS Stylus
语法 Sass h1 {color: #0982C1; } h1color: #0982c1 LESS h1 {color: #0982C1; } Stylus /* style.styl */ h1 ...
- css预处理器sass/scss入门
sass/scss入门 一.css预处理器是什么? 二.为什么要用css预处理器? 三.sass.less.stylus的区别? 四.sass与scss 五.sass安装 六.sass常见用法 6.1 ...
- Less(CSS预处理器)
Less 基础 css弊端 CSS 是一门非程序式语言,没有变量.函数.SCOPE(作用域)等概念. CSS 需要书写大量看似没有逻辑的代码,CSS 冗余度是比较高的. 不方便维护及扩展,不利于复用. ...
- 前端CSS预处理器Sass
前面的话 "CSS预处理器"(css preprocessor)的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件.SASS是一种CSS的开发工 ...
- 您详细比较三个 CSS 预处理器(框架):Sass、LESS 和 Stylus
2019独角兽企业重金招聘Python工程师标准>>> CSS 预处理器技术已经非常的成熟,而且也涌现出了越来越多的 CSS 的预处理器框架.本文向你介绍使用最为普遍的三款 CSS ...
- css预处理器sass使用教程(多图预警)
css预处理器赋予了css动态语言的特性,如变量.函数.运算.继承.嵌套等,有助于更好地组织管理样式文件,以及更高效地开发项目.css预处理器可以更方便的维护和管理css代码,让整个网页变得更加灵活可 ...
- Sass:一种CSS预处理器语言
http://sass-lang.com/ Sass是一种CSS预处理器语言,通过编程方式生成CSS代码.因为可编程,所以操控灵活性自由度高,方便实现一些直接编写CSS代码较困难的代码. 同时,因为S ...
最新文章
- linux命令:sudo浅谈
- C#垃圾回收学习总结
- Android开发实用工具汇总-持续更新
- 皖南医学院2020C语言试卷,安徽继续教育在线 - 皖南医学院
- linux——关于ip、静态网络、动态网络、网关、DNS的设置
- java语言语法--- Java标识符(标识符命名规则)、Java关键字、Java变量(变量的声明、赋值、使用)和常量(字符常量、字面常量)(包括Java字节码文件反汇编命令javap)
- jboss fuse 教程_JBoss Fuse –一些鲜为人知的技巧
- android package.xml,Android自动化编译设置AndroidManifest.xml中package值(包名)
- python魔法函数(二)之__getitem__、__len__、__iter__
- 王兴评华为造车:技术实力、忽悠能力都和特斯拉旗鼓相当;“微信键盘”开启内测;PDF 开发者去世|极客头条...
- android 4实例分析,OpenGL Shader实例分析(4)闪光效果
- python中if continue else,python基础;if else;for;while 分支处理.continue,break
- ElasticSearch搜索引擎安装配置拼音插件pinyin
- html登录注册页面验证代码,登录注册页面验证码问题
- 140个电脑小知识、小技巧(2)
- Win12系统或新增“灵动岛”设计 截图曝光
- 面向数据中心,浪潮存储双剑出鞘
- PHP站内搜索功能(laravel自带Scout驱动+elasticsearch)
- 窗帘轨道怎么安装?方法有哪些?-江南爱窗帘十大品牌
- 公路多孔箱涵设计_双孔8x3.3米钢筋混凝土箱涵设计套图(19张)
热门文章
- 7.2版本中安装的插件都是本插件未被启用???
- webpack安装报错(Unexpected end of JSON input while parsing near '...e6139ad7957,tarball')
- 七、spring生命周期之初始化和销毁方法
- TMS320VC5509片内ADC采集
- 《Java 7 并发编程指南》学习概要 (3)Semaphore, CountDownLatch, CyclicBarrier , Phaser, Exchanger...
- [导入]创建DataTable对象
- 【ES6】对象、函数、数组的扩展
- mysql 查询包含1或者2_Mysql:同一个表上有2个不同的查询,包含count和group by
- 7-40 最大的数 (10 分)
- 7-169 龟兔赛跑 (20 分)