如何避免一些常见的CSS错误
如今，CSS在网站设计和开发过程中被广泛使用。但是有许多人习惯于使用CSS的旧内联CSS方法。除此之外，还有许多人没有正确实现CSS或正确定义类。有几个基本提示，每个人都应该知道，以使其正确。
全世界大多数网站设计师都使用CSS来增强网站的功能和呈现。但是，参与网站设计的人和其他任何地方的人都做得对吗？为了确保你这么做，这里有一些你应该避免的CSS错误。
1、使用id：
特殊层次之一是你构建的选择器类型：ids与类和标签。举个例子：
#my-link {color：red; }
.my-link {color：green;}
a {color：blue; }
使用第一个是三个中最具体的（id）。由于每个页面只能使用一次ID，因此它会获胜。检查以下示例：
假设没有其他风格，文字的颜色是什么？因此，该文本将在网站上显示为红色。遵循CSS特异性，它是下一个最具体的风格是类。在代码中使用id的问题是我们很少看到上面的示例，在给定项目上有一个id或类或标记选择器。ID通常用于上下文中：
#header a {border：2px dashed＃000; }
2、长选择器：
#header #title .left-side img.logo（不透明度：0.5）
这个选择器不仅使用id，而且它也很长。就像ids一样，如果你使用长选择器（深度超过三级），你就会增加特异性。因此，随着定期维护和更新的发生，您将随着时间的推移而复杂化问题。解决方案？不要写长选择器！对于我们之前的例子，有没有理由单独使用.logo是不够的？可能不是。通常，您的选择器应该只有两个级别，或者最多三个。
3、内联样式：
内联样式是特异性错误，也违反了我们使用CSS的主要原因; 风格与结构分离。众所周知，网站设计师停止使用表格进行布局并在外部样式表中使用CSS，他们也停止将我们的样式与我们的结构元素混合，并停止使用结构元素来生成样式。
从特异性的角度来看，内联样式只能被重要标志覆盖。通常，这意味着如果有人在该元素上编写样式并使用重要标记，则他们这样做是作为被动而非主动的行为。
4、自上而下的CSS：
现在我们正在走出特异性，更多地讨论可能已经进入工作流程的坏习惯。让我们想象一下，一旦我们在HTML中编写了基本结构，我们就收到了一个设计补偿，并开始为它添加样式。一些CSS的问题在于你可以告诉它是以自上而下的方式编写的。这模仿HTML布局，而不是抽象设计元素，通常使用上下文的id，例如#header，＃content。这通常导致长选择器并且代码将非常粗略地进行调试和维护。可以通过从页面中抽象设计组件来修复此CSS。这也有助于消除代码中的冗余。
5、冗余/ DRY违规：
冗余意味着你倾向于重复你所做的事情（就CSS而言）。通常在网络编程和各种编程中都会理解，如果你重复自己，你就是在浪费时间，因此就是格言，DRY（不要重复自己）。这同样适用于CSS。举个例子：
-有的标题{字体重量：粗体;}
-有些-其他标题{字体：重量：粗体; 红色}
我们可以将这些组合在一起
.some-title，some-other-title {font-weight：bold;}
。有些-其他标题{颜色：红;}
另一方面，你也可以使用它们的通用名称，并添加一个修饰符类来与标题一起显示它是不同的颜色：
标题
因此，如果我们做对了，就会有很多这样的小滴头，可以真正增强网站并优化性能。
