模板css伪命名空间与不寻常的字符,然后后处理为正常字符.任何缺点/完全不允许的问题



我正在制作一个网站,使用:MODx, SASS, Bourbon &Neat、jQuery、Bootstrap、Velocity和其他一些小库。使用的IDE是PhpStorm,所有文件都是utf-8编码,没有BOM;它还包括来自第三方资源的搜索表单,其中一些放在iframe中,还有一些是"本地"的,使用标准的html表单。所以,命名的地狱就在附近,我还没有建立任何标准化的CSS命名约定,如BEM, SMACSS等,只是一些常见的好的CSS建议(低嵌套级别,良好的语义,。class选择器无处不在)

我要转移到BEM,并寻找一个命名空间,但我不想坚持它,因为这是我的第一个BEM CSS项目,我不觉得100%确定,我将执行良好的一切,我害怕打破一些东西,当做任何全局操作(重命名,也许是别的)。所以,我想用一些非标准的符号组合,比如☺☻或♥♦♠之类的。这应该是100% ,而不是被任何来自第三方的项目库占用。之后,我可以使用(例如Grunt regexp)或自定义后处理应用程序,用正常的名称空间名称替换这些字符,或者根本不使用名称空间(不错的小奖励)。我不打算让这些符号留在生产代码中。Apache、PHP、SASS解析器和浏览器将收到"正常"代码。这些符号将只对"Devend"项目"可见"- Grunt, PhpStorm等。

然而,我从来没有在网上看到任何文章和作者推荐这种方法。因此,看起来它存在主要问题。有吗?

add:这些问题是什么?

PS:我知道,许多现代浏览器都可以使用unicode符号作为CSS类名(就像Java允许函数/变量等使用unicode符号一样)。),因此,理论上我可以让它们保持原样,但它看起来不太好,同样的原因:从来没有见过任何人这样做/推荐这样做。

经过一番研究,我整理出了正确的问题和答案:

如何在以后为项目选择CSS命名空间名称时避免麻烦,使用BEM命名约定


CSS类命名的一个常见的好做法是使用所有小写的字母。也许,在某些命名方法中,规则可能不同,但在BEM中,必须使用所有小写字母。我可以用大写字母加几个破折号,比如NS——。我自己的代码足够集中,可以准确地定义Grunt或PhpStorm等的搜索/替换范围。我可以去开发我的标记,而不必为将来的问题而烦恼。的一个主要优点是,即使没有预处理/后处理,也可以工作,在我的例子中,使用BEM 是一个很好的约定。下一个挑战是如何处理php和js中的组合的classname/selector字符串。在这里,第一部分(静态标记)的解决方案不限制如何解决这个"动态部分"的问题。这里我们还可以通过在PHP和JS中引入变量来避免预处理/后处理。

我喜欢pre/post-processor,但是在这种情况下我们可以避免使用它们,因为它实际上是一个命名约定问题,而不是一个工作流增强问题,这是网站管理员的前/后期处理工具的主要目的

相关内容

最新更新