Web真相: CSS不是真正的编程

每隔几个月就会出现一篇文章表明：CSS并不是真正的编程语言。以编程语言的标准来说，CSS过于困难。使用这门语言会很有创造性：

人们对CSS有一些强烈的情愫。 — Dave Rupert (@davatron5000) [September 18, 2017] 来自于：pic.twitter.com/dDspAM8i2F

事实确实如此，CSS不同于传统的编程，且具有缺陷，同任何标准化编程语言相比，使用起来都更为困难。这是由于CSS被设计为一种描绘界面的方式，而不是以编程形式实现该界面，例如Canvas的API。CSS的设计初衷就不同于传统编程语言。

CSS为用户上网时遇到的一些复杂且未知的东西创建界面，这个设计初衷是很棒的。我在2017年的GOTO Amsterdam大会上详细讲述了CSS和JavaScript的区别（CSS vs. JavaScript: Trust vs. Control）

作为一名CSS开发者，你相信用户代理（大部分情况下指的是浏览器）会表现正确的行为。你无法控制CSS发生的时机，但同时你也无需担心性能、渲染时间和响应的具体细节，因为这些细节是由浏览器开发者和浏览器所处操作系统决定的。不过很棒的一点是，CSS允许你在其应用的地方修改这些重要的细节。如果你使用JavaScript来创建界面或动画，你不仅需要做更多深入细致的控制，还要确保一切都能正常工作，否则可能会阻塞页面的正常显示。使用CSS就意味着放弃控制，而去花更多的时间创建友好的响应式交互界面。用户可能会搞乱你的界面设置，但CSS可以为你规避这种情况。

使用CSS开发不同于传统模式，并不需要循环、条件和变量。但CSS正朝着这个方向发展，Sass作为CSS的扩展语言，引入了变量，为CSS未来的发展奠定了基础。但CSS最需要的不是语法糖，而是你要清楚使用CSS所描绘的界面是什么。其次，如何确保你使用CSS编写的界面是足够灵活的，以至于用户无法触发页面的错误也不会无法访问页面。当你理解了HTML并使用CSS来控制它的样式时，你能够减少很大的代码量。

你的用户们的忠诚度依赖于所在的技术平台，如果你不打算创建友好的交互来提升用户体验，增加用户的留存度，CSS可能并不适合你。CSS被设计为一种“宽容“的语言，当你的一些代码无法起作用时，CSS也不会报错。因此，渐进增强是很棒的设计。你无需担心因添加了一行不支持的代码而出错，解析器会跳过它不支持的属性。当遇到错误时，JS解析器会中断解析并且抛出错误信息，而CSS解析器会忽略这些错误并继续解析。这对于想要知道错误信息的开发者来说会很奇怪，但是却让你从需要使用if来包含各种情况、兼容所有可能使用的浏览器这一状况下解脱出来。如何对按钮使用渐变效果？首先，定义一个背景色，然后在下一行设置背景为渐变。如果浏览器不支持渐变效果，它依旧会渲染出一个正常的按钮，只不过背景不是渐变而已。在这个过程中，你根本无须担心浏览器是否支持渐变。

由于对CSS的设计目的不了解而产生了错误认知，才导致出现了很多“CSS不是真正的编程”的观点。如果你想要完全控制一切，比如界面、甚至精细到像素的话，请不要使用CSS。相反，如果你想要构建一个包罗广泛、多种多样的页面，CSS是个很好的工具。编写CSS需要站在用户的角度考虑，设计拥有良好交互的页面，提升用户体验，但这并不是说你把一个Photoshop生成的图片放到页面就好了。使用CSS构建页面需要不同于后端语言的技术栈，其次，作为维护者、编写者的心态也要发生转变。

不管怎么说，轻视CSS开发者、将他们视为非纯正开发者，这种傲慢的想法略显荒谬。尤其是在你甚至都没花时间了解CSS的设计目的是什么，以及它目前惊人的发展速度。

从另一方面来说，CSS本不是也不应该是任何问题的解决方式。例如，你可以创建带有阴影的像素，但同时也会对浏览器渲染引擎带来渲染压力。

对我来说，CSS就是Web的一部分；对有些人来说，CSS的语法显得很奇怪，以至于让他们觉得是另一种编程语言。不过这些年来，随着CSS的发展，它的价值毋庸置疑。在未来很长一段时间，CSS应该也不会消失。因此，如果你不喜欢使用CSS，那就和会使用的人合作开发网页。如果你的上司要求你使用CSS，尽管我们没有技术文章或刊物，但是我们有相关的项目和CSS开发者能帮助你。

与其讨论“CSS是否有缺陷，需要被替代”的问题，不如以一种积极健康且不同于以往的角度讨论CSS：

• CSS可以做什么，它有什么不足
• 有哪些过去需要其他技术才能实现的，而现在CSS就可以做到的事情，以及如何应用
• 如何编写可维护的CSS
• 你能够做什么，来使CSS开发者的开发过程更简单、容易？
• 我们使用哪些CSS hack，为什么不应该再用它们
• 我们可以做什么来让CSS这门语言变得更好、更丰富？

小手一抖，资料全有。长按二维码关注京程一灯，阅读更多技术文章和业界动态。