Question

我是所有这一切的新手。

出于某种原因，我痴迷于在CSS文件中完成所有样式。

所以即使是像句子样式这样简单的东西，我也会这样做：

<p class="content"> Welcome to my site </p>

而不是像这样：

<p style="font-size: 13pt; font-weight: bold;"> Welcome to my site </p>

为了这个问题，上述文本只会在整个网站上使用一次。从技术上讲，这是最好的方法吗？一个比另一个更好还是更快？你会用哪种方式？

此外，如果我要设置“欢迎使用我的网站”文字的样式，但没有像<p>那样的上方或下方有任何额外空间，那么最适合使用哪个标记？

感谢。

Answer 1

您的第一种方法是最好的，因为它遵循一个非常有用的Web开发原则，不要重复。

例如，如果您有多个页面具有某种强调文本的方式，则您不希望一遍又一遍地重复所有样式。这就是你使用外部CSS文件的原因，因此所有样式信息都在一个地方，HTML文件严格用于内容和结构。

另外作为旁注，不要创建太多的类，充分利用内置于HTML和HTML5中的标签，如em，h1到h6，强大的等等，因为它们可以节省你一些写作时间HTML和CSS

Answer 2

第一个更好，第二个由于几个原因而皱眉头。

考虑一下，如果你有10个具有相同样式的段落，并且有一天你决定改变这样的样式。然后，哪种方式会更容易：查看所有页面并查看每个段落或只是在一个地方更改它？

此外，如果不使用内联样式，您可以：

Answer 3

关于前三个问题，请参阅此answer。如果您不希望在p标签的上方和下方留出间距，请使用

<p style="margin: 0;"> Welcome to my site </p>

Answer 4

你应该养成使用内联样式的习惯，它们很糟糕，并且防止你的标记干净易读。即使它仅用于一个元素，您也可以在CSS中定位id，这表示只有一个（每页）。

Answer 5

绝对是第一种方法更可取。它看起来更好，更清洁，更正确。你应该始终保持一致，外部样式表是可行的方法。如果你想要更干净，你可以避免class =“content”，如果它在一个具有特定名称的div中，并且你希望该div中的所有段落具有相同的样式（你应该）。

例如：

<div class="content"><p>Welcome to my site</p> ~~~ other content ~~~~ </div>

然后

#content p { ~~~ styles ~~~ }

现在，就你的另一个问题而言。要获得内容周围没有任何空间的内容，请使用<span>标记。您可以将其设置为与<p>标签相同的样式，只要我知道它周围没有任何空间，并且不会对边距或填充做出反应。