为什么不鼓励内联样式？

Question

众所周知，令人敬畏的程序员正在使用StackOverflow。使用StackOverflow作为证据，据说不鼓励内联样式。为什么会这样？请解释一下。

他们只是破坏了级联吗？没有？然后他们做了什么？

谢谢：）

Answer 1

我被确定了以下原因

1. 您无法在其他任何地方重复使用这些样式。

2. 页面的html标记变得很麻烦，难以用肉眼解析。

3. 因为它们不是存储在一个地方，所以很难被编辑

4. 此方法不会在您的应用程序中提供一致性。元素的内联样式可能会引起严重的问题。

5. 它没有为您提供浏览器缓存优势。客户端在每次请求时都会重复下载这些文件。相反，请考虑使用外部样式表。

6. 内联样式优先于页面级样式声明和外部样式表。因此，您可能会意外地覆盖您不想要的样式。

7. 使用内联样式设置伪元素和类的样式是不可能的。例如，使用外部和内部样式表，您可以设置锚标记的已访问，悬停，活动和链接颜色的样式。

Answer 2

有技术原因和意见/方法/风格/范例。主要技术原因是，如果在页面上的两个或多个位置使用相同的样式，则相同的内联CSS代码需要存在于多个副本中。这反过来会使维护，特别是样式的改变，实质上更加困难。它也会有其他很明显的缺点。

大多数情况下，您不会在单个元素上设置样式，而是在元素类型或类上设置样式，或者在多个元素上设置样式。即使你有每个页面只有一个h1元素，以特定方式设置样式，你可能在几个页面上有这样一个元素，并且通常想要使用相同的样式（或者可能是相同的基本样式）和一些每页增强功能）。有时你想要设计一个单独的元素，但是你以后想要在另一个元素上使用相同的样式仍然是可以想象的。使用外部样式表，例如然后，使用class属性可以非常简单地重复使用样式。

但是，如果这些问题不适用（他们通常会这样做），那么没有坚实的技术理由反对使用内联样式。当您为invidual元素指定样式设置时，不希望重复使用这些设置，那么style属性实际上更方便，更紧凑，更易读。将<p style="color: red">text</p>与<p id="foobar">text</p>以及#foobar { color: red; background: white }在另一个文件中进行比较。

但在一个更典型的情况下，您会发现在另一个文件中编写<p class="warning">text/p>和.warning { color: red; background: white }更有用。

Answer 3

它们，

1. 分开关注。
2. 提高可读性/可访问性。
3. 将html文件缩小。