如何防止样式表成为难以理解的混乱?

xnam 发布于 2019-03-09 css 最后更新 2019-03-09 14:39 3 浏览

如何防止CSS样式表(或预处理小于或SASS ...)成为一个不可理解的混乱,它是不可能预测什么了风格会影响到每一个元素,你必须给你的艰苦基于CSS的设计做所有进一步的调整和无尽的试验和错误? 背景:每次我开始在网站上工作的时候,我开始用干净和良好组织样式的设置,框架(通常引导),然后布局样式,凸版印刷一个,对于一些网站配色方案样式,然后一般“看起来”样式按地区和分区域等分组。直到通过缓慢添加东西,这些都变得非常好,干净,事情达到了一个“突破点”:我不能再将风格规则“运行在我的头上”,选择器变得如此复杂,以至于我无法轻松预测新规则中的元素将适用于,所以我开始打破层次结构并添加一个“tweaks1.css”调整图层,然后是“tweaks2.css”,然后所有它是下坡,风格已变得完全不可理解! ...无论我使用LESS还是SASS,都会发生同样的事情。 CSS的级联性质总是让我感到最好。所以......有什么办法强制CSS提交?这里有没有“设计模式”? 注:我是一个程序员,我有一个以上的范式和编程语言的经验,我没有问题闹得不可开交大的代码库,但是当我到前台工作,CSS莫名其妙的“层叠规则”逻辑简单地打破了我的心在一个点...我曾经得到与JavaScript意大利面相同的“难以理解”问题,但对于代码有模式和最佳做法,我找到方法重构提交的东西...

已邀请:

sed_et

赞同来自:

这在CSS中总是一个棘手的部分。写作时最好的方法是评论和视觉组织你的CSS。例如,我的总是分为页面基本(定义字体,背景等)基本文本格式(p,h1-h6,i,b),链接和菜单(a,a:hover,nav),表格,格式化(div,section),表单/输入和转换/效果。 在测试阶段,我在Firefox中使用firebug来向我展示在元素级别应用的CSS属性,继承的内容以及将被覆盖但已被覆盖的内容。