CSS 作为一种编程语言,自然有与其对应的缩进写法,类似这样
这个写法暗示了选择器命中元素在 DOM 中的位置,也给维护对应语句提供了定位路径
如果没有缩进,所有语句胡乱堆砌在一起,就是一座屎山。无数人抱怨 CSS 不可维护,就是找不到应该从哪里入手修改,只能碰运气搜索一下,不久就放弃了,然后在文件末尾新启一行,糊上新的屎
我自己给常用的 200 个网站编写 UserCSS ,其中最长的(刚好是本站)有近 700 行,短的也有几十行,如果没有缩进,维护这些 CSS 不可想象
这种写法如此自然,以至于我想象不出为什么很少有人这么写,不是本该如此吗
102
autoxbc OP @GeruzoniAnsasu #95 如果你大量写抽象 class ,那你的项目里抽象 class 就是主体,反之,抽象 class 可能很少,要看你的开发习惯。我不会强迫你接受,不过你也不能假定这一定有很大的思维负担,毕竟我已经实践了很多年
就算是动态 DOM ,新的元素出现在哪里也是确定的,元素在哪描述元素的样式就在对应的位置 至于这个结构到底是 mesh 还是 tree ,我的实践说明是以 tree 为主。如果你可以设计出一种与 mesh 对应的 CSS 文件结构,我也鼓励你写成那种结构,无论如何,线性的连续堆砌不是种好的结构 |
103
autoxbc OP @GiantHard #96 我的场景确实主要是 UserCSS ,不过这些 UserCSS 显然都对应了真实的主流的网站。如果他们的开发没生成这些 className ,没生成那些大段的超长的有明确 className 的 CSS ,显然我的工作就几乎无法进行。这么看的话,到底什么是真实的主流的开发场景,还真不好说
|
104
autoxbc OP @chnwillliu #97 组件化确实把问题解决了----一部分,不过并没有完全消失。组件里也有节点,有节点就有结构,有结构就有样式描述的结构
假设 <html> <head> <body> 这三个元素构成一个组件,你会怎么写 CSS 呢,我会写成 html {} 顶格,head {} body {} 缩进 关键是,这是一个帕累托改进,没有引入任何实体,没有引入任何成本,却有实在的收益 |
105
autoxbc OP @lneoi #98 修改 HTML ,就要修改 CSS ,这是 CSS 这种样式分离语言自身的问题,不是缩进方案的问题。如果修改 CSS 需要变动十几个语句加调试成本,修改这些 CSS 的缩进就是选中,快捷键改缩进,剪切粘贴。维护缩进的成本可以忽略不计
|
106
autoxbc OP @lneoi #100 前端界开始反思样式分离的意义,这显然是积极的,但这不是本贴的语境。本贴说的是,如果你需要样式分离,应该怎么组织这个分离的样式文件
|
107
zenben 2022-05-21 14:18:53 +08:00
缩紧对于代码的阅读和维护确实有它的好处, 不过我记得 scss 还是什么可以利用插件实现非嵌套的 output, 而是输出的也是可以支持缩进格式的语法
|