在这种情况下，使用 CSS 设置数据样式的最佳方法是什么？

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, strong等，因为它们会在编写HTML和CSS时节省一些时间

Answer 2

显然第一种方法更可取。它看起来更漂亮，更干净，更正确。您应该始终保持一致，外部样式表是可行的方法。如果您想要更简洁，如果它位于具有特定名称的div中，并且您希望该div中的所有段落具有相同的样式(您应该这样做)，则可以避免使用class="content"。

例如:

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

然后

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

现在，至于你的另一个问题。要使内容周围没有任何空间，请使用<span>标记。你可以样式它与<p>标签相同，就我所知它周围没有任何空间，不会对边距或填充作出反应。

Answer 3

关于你的前三个问题，请参考这个答案。如果不希望p标签上下有空格，请使用

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

Answer 4

第一个更好，第二个由于几个原因而不受欢迎。

考虑一下，如果你有10个段落具有相同的样式，有一天你决定改变这些样式。那么，哪一种方式更容易:浏览所有页面并查看每个段落还是只更改一个地方?

此外，如果不使用内联样式，您将:

1. 让你的代码更容易阅读。
2. 很可能使你的网站更快(更小的文件大小，浏览器很可能缓存你的css)。
3. 让你更难重用你的样式
4. 对任何可能继承你项目的人都很好。

Answer 5

你应该改掉使用内联样式的习惯，它们很糟糕，会妨碍你的标记清晰易读。即使它只是一个元素，你可以瞄准id然后在你的CSS，这表明只会有一个(每页)。