I've been using CSS preprocessors for about a year now. I gave all of them a try. LESS first, then Stylus, then Sass. All on real projects, not just poking around and tinkering with syntax. They are all pretty good. The truth is, developer to developer, I don't really care if you use one or not or which one. I don't care in the same way I don't care if you use Dreamweaver as your code editor or a PC as your computer. I personally don't want to use those things, but if you're productive in doing so, more power to you. Mostly I just want you to build good websites.
我已经使用CSS预处理器大约一年了。 我尝试了所有的人。 首先，先少手写笔，然后是Sass。 所有的都是真正的项目，而不仅仅是四处寻找语法。 他们都很好。 事实是，开发人员与开发人员之间，我真的不在乎您是否使用一个或哪个。 无论您使用Dreamweaver作为代码编辑器还是使用PC作为计算机，我都不会在乎。 我个人不想使用这些东西，但是，如果您这样做的效率很高，那么您将获得更多的权力。 通常，我只希望您建立良好的网站。
But If you ask me if I think CSS preprocessors are worth learning, incorporating into your workflow, and what my favorite is, I'd tell you: yes, yes, and Sass with Compass.
但是，如果您问我，我是否认为CSS预处理程序值得学习，将其整合到您的工作流程中以及我最喜欢的是什么，我会告诉您：是的，是的，还有Sass with Compass 。
The following is my perspective on the features of preprocessors and how I feel about them after about a year of use. Instead of just telling you what they do, I'm going to tell you why they matter to me and my workflow.
以下是我对预处理器的功能以及使用大约一年后的感觉的看法。 我不只是告诉您他们的工作，而是要告诉他们为什么对我和我的工作流程很重要。
变量。 他们将您从自己手中救出来。 (Variables. They Save You From Yourself.)
I could tell about how variables help make your code DRY. I could tell you how about how it's cool that you can change them once and it changes the value everywhere. But you know that.
我可以说说变量如何帮助使代码变干。 我可以告诉您一次更改它们有多酷，它随处更改值。 但是你知道的。
The real reason variables make a difference for me authoring styles is that they save me from myself. When my brain thinks "I need blue here", I type "$blue". In the past I might have opened up Photoshop and tried to use the colorpicker on some tiny element somewhere on the screen and ended up with some close-but-not-quite right blue. This is the kind of dumbheaded stuff we're all guilty of sometimes and has real negative impact on designs.
变量对我的创作风格产生影响的真正原因是，它们使我摆脱了自己。 当我的大脑认为“这里我需要蓝色”时，我键入“ $ blue”。 过去，我可能已经打开Photoshop并尝试在屏幕上某个小元素上使用颜色选择器，最后得到一些接近但不完全正确的蓝色。 这是一种愚蠢的东西，有时我们都感到内gui，对设计有真正的负面影响。
Now when I need a color, I make sure it's set up as a variable and use the variable. It makes me quicker and more consistent. And I don't get too clever with it either. I name blue $blue and orange $orange. If I called it $mainLinkColor and $primaryBrand I wouldn't remember my own cleverness and the benefit would be gone.
现在，当我需要一种颜色时，请确保将其设置为变量并使用该变量。 它使我更快，更一致。 而且我也不太聪明。 我将其命名为blue $blue和orange $orange 。 如果我将其命名为$mainLinkColor和$primaryBrand我将不记得自己的聪明之处，而收益将消失。
Mixins。 停止拧紧CSS3。 (Mixins. Stop Screwing Up CSS3.)
I could tell you how mixins are like functions and help keep your code DRY. I could tell you how updating your mixins can help you make sweeping changes much easier in your code. But you already know that.
我可以告诉您mixin像函数一样如何帮助保持代码干燥。 我可以告诉您如何更新mixins如何帮助您轻松地在代码中进行全面更改。 但是你已经知道了。
The real reason mixins are valuable to me is they keep from from screwing up CSS3. Point me at just about any website on the internet using any CSS3 and I bet we could something incorrect they doing with CSS3. Missing vendor prefixes. Out of order prefixes. Incorrect syntax usage. Not using older syntaxes when needed. This stuff is complicated and a moving target.
mixin对我来说很有价值的真正原因是它们避免搞砸CSS3。 使用任何CSS3将我指向互联网上的几乎任何网站，我敢打赌我们可能会用CSS3做一些不正确的事情。 缺少供应商前缀。 乱序前缀。 错误的语法用法。 需要时不使用较旧的语法。 这些东西很复杂并且是一个不断变化的目标。
Sass has Compass and Compass provides us with the best possible output for CSS3 features. I'm a bit of a CSS nerd. I kind of enjoy knowing and teaching the latest and greatest CSS to use. But even I grow weary of this prefix situation. It's neither fun nor practical to keep all my projects updated to the latest and greatest at all times by hand. With Compass I don't have to.
Sass有Compass，而Compass为我们提供了CSS3功能的最佳输出。 我有点CSS书呆子。 我喜欢了解和教导要使用的最新最出色CSS。 但是，即使我对此前缀情况也感到厌倦。 随时手动将所有项目更新到最新和最伟大的做法既不有趣也不实际。 有了Compass，我不必这样做。
自动化任务，否则无法手动完成 (Automating Tasks Otherwise Impractical To Do By Hand)
Some of these thing might sound like mighty nice conveniences. But I think CSS preprocessing gets out of the realm of convenient and into the realm of required when it helps with tasks that are completely impractical to do manually.
其中一些听起来像是很棒的便利。 但是我认为CSS预处理可以帮助手动完成完全不切实际的任务，因此脱离了方便的领域，进入了必需的领域。
Example 1: You can set $experimental-support-for-svg: true; and now when you use the background() @mixin for a gradient, it will produce and data URI SVG gradient as well. That means IE 9 support for gradients. For nearly zero work. That's a pretty big deal.
示例1：您可以设置$experimental-support-for-svg: true; 现在，当您使用background() @mixin进行渐变时，它也会生成并数据化URI SVG渐变。 这意味着IE 9支持渐变。 几乎为零的工作。 那是很大的事情。
Example 2: You can @import files into other files. Unlike native CSS, this actually compiles them together in the CSS output. Like a server side include. This means you can compress and concatenate arbitrary files together. This means you can work in whatever organizational scheme you want to, matching however your brain works not how any given technology wants you to. It's pretty impractical to do all this concatenation and compression by hand.
示例2：您可以@将文件导入其他文件。 与本机CSS不同，这实际上在CSS输出中将它们一起编译。 像服务器端一样。 这意味着您可以将任意文件压缩和连接在一起。 这意味着您可以按照您想要的任何组织方案工作，但是匹配您的大脑却无法满足任何给定技术想要的方式。 手动进行所有这些级联和压缩是非常不切实际的。
Example 3: Learn about spriting with Compass. It's pretty dang amazing how little work you need to do.
示例3： 了解有关使用Compass进行拼写的信息。 相当惊人，您需要做的工作很少。
嵌套。 感觉不错的功能。 (Nesting. The Feel Good Feature.)
When I go back and write regular CSS (which I'm not afraid to do and I think we all should once in a while), the feature I miss the most is nesting. Every time I have to write stuff a repetative selector, like:
当我回去编写常规CSS时(我不怕这样做，我认为我们都应该偶尔进行一次)，我最想念的功能是嵌套。 每次我必须编写一个重复的选择器时，例如：
.module
.module ul {}
.module li {}
.module a {}
最重要的事情 (The Most Important Thing)
CSS preprocessing makes CSS fun again. If you write enough plain CSS, it wears on you. I absolutely love the power of CSS. I love working with CSS. I love making things with CSS. But I tire of all the tedious stuff. I want to work faster and more efficiently. That's what CSS preprocessors really do. The have made working with CSS rewarding to me again and that's why they matter.
CSS预处理使CSS再次变得有趣。 如果您编写了足够的普通CSS，那么它就会很麻烦。 我绝对喜欢CSS的强大功能。 我喜欢使用CSS。 我喜欢用CSS制作东西。 但是我厌倦了所有乏味的东西。 我想更快，更高效地工作。 这就是CSS预处理器真正要做的。 与CSS的合作再次使我受益匪浅，这就是它们如此重要的原因。
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
