什么时候应该使用属性和 CSS 样式？答案

【问题标题】：When should I use attributes vs CSS styles?什么时候应该使用属性和 CSS 样式？
【发布时间】：2014-07-16 23:40:22
【问题描述】：

有时在 xhtml 中我们写假设 <table border="1">，然后在 css 中我们再次写 table{ border:2px solid black}。我很困惑什么时候写哪个。何时使用属性以及何时使用 css。有时他们会感到困惑。

【问题讨论】：

关于border属性：Do not use this attribute, as it has been deprecated: the <table> element should be styled using CSS.developer.mozilla.org/en-US/docs/Web/HTML/Element/…
这只是一个例子。另一种是单元格间距和单元格填充。有时它被声明为属性，有时在 css 中。它变得令人困惑。
cellpadding 和 cellspacing 也是如此：developer.mozilla.org/en-US/docs/Web/HTML/Element/…
@RandomUs1r - 这就是为什么你永远不应该关注 w3schools 所说的内容。它经常是错误的。并且与 W3C 没有任何关联。
@RandomUs1r ... 永远不要相信 w3schools 会弄清事实。去文档本身。即使网站纠正了一些问题，它仍然不如文档本身可靠，并且绝不是反对文档的有效论据

标签： html css xhtml

【解决方案1】：

如果您不确定要使用哪种工具，请考虑一下它们的实际用途。

HTML 是一种标记语言。它用于描述您网页上的内容，以便浏览您网站的任何人都能理解它。它定义了段落、引用、重要的内容、导航等。

CSS 是一种样式语言。它描述了您的内容是如何呈现的。使用它来使元素看起来像您希望它们看起来的样子，使您的网站成为具有视觉吸引力的东西。

边框是内容视觉风格的一部分。您将内容放在表格中是因为它有意义，但如果您想为表格添加边框，请添加 CSS 规则以使其看起来像您想要的那样。

您经常会发现，较旧的 HTML 代码编写时使用了更多用于设置内容样式的属性，以及 <font> 和 <center> 标记以及其他将内容与演示文稿混合在一起的东西。您可能还会发现网站的某些视觉部分在纯 CSS 中是不可能的，并且需要额外的标记才能使其工作；这些是您作为 Web 开发人员需要做出的权衡。

【讨论】：

【解决方案2】：

虽然边框属性is not deprecated 而the align attribute is（以显示HTML4 推荐的属性状态），但通常建议不要将这些属性放在您的标记中。

我在查看 XHTML table documentation 时找不到对这些属性的引用，所以我认为这些属性在那里是不可接受的。

代替有问题的属性，使用 CSS 消除了混合内容和样式。 XHTML 似乎完全专注于内容而不是样式，所以我不得不说，虽然它是可以接受的，但这并不是在外部样式表中使用属性代替 CSS 的最佳途径。

我可以看到使用属性而不是 css 的一种情况是在设计 html 电子邮件时，因为大多数电子邮件客户端会剥离 css，除非它使用 style 属性声明为内联。在这种情况下，使用单个属性可能比将所有规则填充到 style 属性中更简洁。

更新

由于其他用户在评论中提供的信息，我发现我正在查看的 XHTML 规范已经过时。 Modern XHTML 确实识别并支持诸如边框之类的属性。提供的链接是对 html 和 xhtml 之间差异的解释，作为对该主题的介绍。好东西。 我引用的评论如下：

当您讨论 XHTML 文档时，您的意思是已终止的 XHTML 2 规范。现代 XHTML 是 XHTML5，它具有与常规 HTML5 相同的属性和内容模型规则，只是语法不同。 XHTML 2 的作者着手消除多年来在 HTML 上积累的所有垃圾，因此采用了一种非常纯粹的方法。 HTML5 作者采取了更加务实的态度，认识到某些奇怪的特性，如border="1"，实际上是有用的，并允许它们用于那些狭窄的情况。

【讨论】：

当您讨论 XHTML 文档时，您的意思是已终止的 XHTML 2 规范。现代 XHTML 是XHTML5，它具有与常规 HTML5 相同的属性和内容模型规则，只是语法不同。 XHTML 2 的作者着手消除多年来在 HTML 上积累的所有垃圾，因此采用了一种非常纯粹的方法。 HTML5 作者采取了更加务实的态度，认识到某些奇怪的特性，如border="1"，实际上是有用的，并允许它们用于那些狭窄的情况。
@Alohci - 很棒的信息！不知道，谢谢分享！

【解决方案3】：

您应该更喜欢样式而不是属性，在这种特殊情况下，您应该始终使用样式，因为根据 W3C index of attributes，<table> 上的 border= 属性已被弃用。 Cellspacing 和 cellpadding 并未被官方弃用，但不鼓励使用，它们在 HTML5 中被列为 "obsolete features"。

尽可能地保留文档中的所有样式/演示文稿 - 文档应该是内容和结构 - 然后使用 XSLT 或 CSS 设置您想要的样式。

【讨论】：

在cmets中已经指出这个语句（“上的border=属性已被弃用。Cellspacing和cellpadding也被弃用。”）是无效的。如果您可以为此提供可以直接从 W3C 覆盖文档的文档，我将删除我的反对票

@Brett 当然，谢谢，我会引用来源...但是在我撰写此内容时，至少在我点击“发布”之前没有 cmets

没问题。我只是想保持这个问题的准确性，因为不久前我有完全相同的问题。直到我看到这个，我仍然对此感到困惑。不过，我同意不应使用该属性。

【解决方案4】：

不推荐使用表属性。您应该始终使用 css 来设置表格样式。无论您是创建单独的样式表还是将其嵌入到您的 html 文件中。

任何 html 元素都可以使用 css 设置样式。

编辑：

有关已弃用属性的更多信息，请点击此处：http://www.w3.org/TR/html4/index/attributes.html

祝你好运！

【讨论】：

在cmets中已经指出这个语句("Table attributes are deprecated")是无效的。如果您可以为此提供可以直接从 W3C 覆盖文档的文档，我将删除我的反对票
这是指向属性的链接。与表格相关的行定义边框并未显示该属性已被弃用。应该表示这一点的空格是空白的，不包含图例中定义的字符“D”，以表示不推荐使用的属性。此属性在 HTML4 的此建议中以及 HTML5.1 的草案中均未弃用。除此之外，预计也不会逐步淘汰。对不起，这只是巩固了问题上的cmets
不想成为一个超级固执的人，只是想保持这个问题干净，因为我也对此感到困惑。不过，我确实同意不应使用该属性。