css - SASS 嵌套(为了可读性),这是一种不好的做法吗?

标签 css angular sass

一个更有经验的同事告诉我嵌套我所有的 SCSS,所以它会反射(reflect)它在 HTML 中的外观,并声称它会为可读性带来奇迹。

我真的很担心这是不必要的,并且可能会显着降低应用程序( Angular )的速度。

在重新格式化的文档中,选择器进入 5 级,而在原始文档中它从未超过 3 级。

使用 SASS 嵌套的最佳实践是什么?是否应该仅在出于特定目的而有必要时才使用它?还是可以更好地格式化我的文档?

最佳答案

我会尽量不要以与 HTML 嵌套相同的方式直接嵌套它们,因为您说得对,您的 CSS 中会有不必要的选择器。

https://smacss.com/ 上有一本很棒的书它教您将代码拆分为模块。我建议将您的 HTML 分成 block /模块并嵌套相关选择器而不是所有选择器。

经验法则:您包含的选择器越多,它在设置样式时的优先级就越高。

注意:我建议研究手写笔,因为我认为这提高了 SCSS 的可读性。

关于css - SASS 嵌套(为了可读性),这是一种不好的做法吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47093232/

相关文章:

javascript - renderer2 selectRootElement() 不匹配任何元素

html - (HTML & CSS) 仅主页上的透明导航栏。其他 View 中的黑色背景色

CSS 列和同等内容

javascript - 在 Angular6 中对一个组件使用多路由

javascript - 悬停时更改表格行和列的背景

html - MIME 类型 ('text/html' ) 不可执行,并且在尝试使用 express 呈现 angular2 时启用严格的 MIME 类型检查

css - Grunt compass 和 sass/css 目录

css - 问题让元素在具有多个 float 元素的容器中 float

css - 如何从聚焦的输入元素中删除蓝色轮廓?

html - 溢出 :scroll and 100% height