对于初学者来说，CSS 可能很难。该语言的性质与传统编程语言截然不同。虽然学习各个部分很容易：selectors，properties但etc.实际将多个想法组合在一起以产生新的或更复杂的东西要困难得多。
CSS 中并没有太多直接的路径。有多种方法可以实现相同的概念，因此很难找出一种对你来说很新奇的解决方案，也很难知道它是否是正确或最佳的方法。如果“视情况而定”是高级开发人员的口头禅，那么 CSS 确实是一种为填补经验丰富的开发人员心中的空白而编写的语言。
尽管很难填补知道何时何地做什么的知识空白，但这正是它如此美丽的原因。CSS 非常强大且功能强大，因为各个声明可以复杂地组合在一起，形成一曲美妙的风格和布局交响曲。
我的核心建议之一是：要灵活，不要固执。我认为这才是这篇文章关于 CSS 的真正主题。由于 CSS 的复杂性，编写时应该如此，因此对编写方式有自己的看法很重要，甚至是必不可少的。
1、不要包含不需要的 CSS
太明显了？也许不是！一旦你让一些不必要的东西留在代码库中，未来就没有人能够轻易判断它是否必要——甚至你自己也不知道！
2、使用注释
具体来说，有时您需要编写一些 CSS，但您不确定为什么需要它。使用CSS注释是一种非常友好得方法，对您和将来审查代码的任何人来说都是如此。注释以便以后重新审视代码，以重构和改进代码库。它会告诉这段代码是干什么的，指出以后可能出现难以跟踪的错误的位置。
3、避免使用 ID 进行 CSS 选择
在这样做的过程中，你会发现核心概念之一是善于管理代码中的特殊性。在这样做的过程中，Id 选择器太强大了，以至于人们无法习惯使用。
4、避免使用 !important
在CSS中，`!important` 是一个特殊的声明，用于提高某个CSS属性的优先级，使其覆盖其他可能冲突的样式。它通常用于解决样式表中的优先级冲突，尤其是当多个样式（可能是来自不同的样式表或内联样式）应用到同一个元素时。
!important，虽然在极少数情况下你绝对需要它（尤其是继承或较旧的代码库），但如果你发现自己在使用它，那么你得注意了。
5、找出一个一致的系统
命名、结构、选择、变量、嵌套、作用域；CSS 中有很多地方需要系统一致性，这将大大提高代码的可重访性和可维护性。拥有任何类型的系统，记录下来，然后使用它。至于你应该使用什么系统，这完全取决于你。做有意义的事情。
6、重置和默认设置很有用
与系统化类似，良好的重置可以消除 CSS 入门过程中的一些陈旧复杂性。
默认值与重置类似，但可以以几种巧妙的方式使用。全局定义默认值。但也可以定义您不能错过的东西的默认值。经典示例是选择并将边框应用于所有未定义alt属性的图像：
img:not([alt]) {
border: 5px solid red;
}
6、了解代码库
这可能更适用于团队合作，但花更多时间阅读和内化您未在项目中编写的 CSS 非常重要。将您的编码风格和您使用的工具与现有系统保持一致对于在您参与构建代码库时保持代码库的凝聚力至关重要。在继续贡献您自己的组件和样式之前，请先了解您的重置、实用程序类、全局 CSS 变量、排版、颜色和间距系统。
7、严重依赖 CSS 变量
CSS 变量不仅仅是为了节省您的按键次数。设置 CSS 变量就像您正在收集工具来实现您的设计一样。“我知道我需要这些颜色、背景、像素值等。”这样做将开始形成一个有凝聚力的 API，使您正在设计的东西具有特定的风格。在大多数情况下，您将能够轻松地使用值，并在主题的变体中自定义样式和布局。
8、首先评估设计的响应要求
在编写任何 CSS（尤其是布局 CSS）之前，请先仔细考虑一下您的设计。了解您要构建的下一个内容如何响应式地运行至关重要。清晰的响应式理解将带来更清晰、更优雅和更周到的 CSS 解决方案。
9、避免在组件上使用外边距，在容器上使用内边距
边距的特殊之处在于它通常传达项目之间的间距定义。在设计组件的样式时，如果组件通常尚未建立上下文，则您需要等到组件实例化到最终上下文后再定义边距。
类似地，在设计用于包含或插入其他未知上下文项的样式时，请注意不要将自己固定在特定的填充集上，以便可以在使用的每个实例中适当地定义它。
根据您的系统或设计需要的灵活性，也有例外，但它有助于从谨慎的心态开始，然后明确选择将间距与任何组件结合起来。
10、不要粘贴 CSS
我再怎么强调这一点都不为过，特别是对于初级开发人员。不要粘贴 CSS。因为写出每个属性定义既能让你成为更好的 CSS 开发人员，又能让你动脑筋，让你始终对正在编写的 CSS 做出明确和理解的选择。
总结
我相信我可以继续扩充这个列表，直到它符合我个人的 CSS 编写风格。如果您不同意其中任何一项，那也没关系，它们只是我的观点。但我确实认为我挑选了一组可以普遍接受的，并且我认为它们为帮助人们简化 CSS 方法并最终获得更简洁、更好的代码提供了坚实的基础。我希望这篇文章能引出一个问题：您对 CSS 有什么看法？
暂无评论内容