# CSS

层叠样式表 (Cascading Style Sheets,缩写为 CSS),是一种样式表语言,用来描述 HTML 或 XML(包括如 SVG、MathML、XHTML 之类的 XML 分支语言)文档的呈现。CSS 描述了在屏幕、纸质、音频等其它媒体上的元素应该如何被渲染的问题。

CSS 是开放网络的核心语言之一,由 W3C 规范实现跨浏览器的标准化。样式可以通过定义保存在外部 css 文件中,同时控制多个网页的布局,这意味着开发者不必经历在所有网页上编辑布局的麻烦。

在之前,特别是前端新人,可能会觉得 CSS(默认包括 css3 版本,下同)很简单。没错,我在刚开始的时候也是这么觉得的,不过随着深入之后,我发现 css 还是别有洞天的,有着太多细节性的知识点需要我们去搞定和积累。以及随着数量的增多,不知道你们是否会有一个纠结于怎么命名的阶段,反正我是有过。

个人对于 css 部分的学习,算得上有去关注。css 手册也看过几遍,不过想要记住所有的标签和属性还是不现实的,至少对于我而言是这样的。当然对于常用的,应该是没啥大问题。

css 本身是不具有逻辑性的,如果我们一直都是采用最原始的直接书写 css,感觉效率还是有很大提升空间的。所以我们可以选择一种 css 预处理工具来加快我们的开发及书写效率,我自己选择的是SASS 中的 SCSS 版本

随着 nodejs 的诞生以及前端自动化工具的普及,借助 grunt/gulp/npm/webpack(目前主要是 webpack)等构建工具,确实可以大大的解放我们的双手。那些之前需要手动编译刷新的重复工作,如今都可以直接交给电脑自动处理了。

我们可以从语言和功能两个角度去了解。在语言部分,我们要了解 CSS 的各种语法结构,比如@rule、选择器、单位等等。功能部分,我们大致可以分为布局、绘制和交互类。

# css 的书写习惯

  • 一般情况下采用的是英文单词,其次采用的是拼音,当然英文单词和拼音都有可能采取缩写。会尽可能的去遵循语意化。
  • 使用的是连字符“-”方式连接单词,目的其实很简单,就是跟 css 自身的风格保持一直。我自己是优先使用连字符方式的,但是也不排斥下划线和驼峰式连接方式。
  • 至于BEM(Block Element Modifier)风格这种东西,看个人喜好和团队规范。想法理念是挺好的,但也是要灵活的去用而不是一味遵循。

# 目录归档

# 参考手册(推荐)

上次更新: 2021-05-07