html - 传统的 "HTML is only for content"思路如何处理动态格式化？

Question

长期以来，我阅读并理解了以下有关 Web 开发的真理:

1. HTML 用于内容
2. CSS 用于展示
3. JavaScript 用于行为。

这通常都很好，我发现当我严格遵循这些准则并使用外部 .css 和 .js 文件时，它使我的整个网站更易于管理。但是，我想我找到了打破这种思路的情况。

我有一个为我的网站之一构建的自定义论坛系统。除了此类系统的常规范式(链接、图像、粗体斜体和下划线等)之外，我还允许我的用户设置其文本的格式，包括颜色、字体系列和大小。所有这些都以格式化代码的形式保存在论坛消息数据库中，然后在查看页面时转换为相应的 HTML。 (有点低效，技术上我应该在保存之前翻译，但这样我可以在系统上实时工作。)

由于这个系统和其他类似系统的性质，我最终在生成的 HTML 代码周围出现了很多标记，我认为这些标记已被非正式弃用，因为我应该使用 CSS 进行格式化。这违反了第一条和第二条规则，即 HTML 不应包含格式信息，而应将该信息放在 CSS 文档中。

有没有办法在 CSS 中实现动态格式设置而不在标记中包含该信息？值得这么麻烦吗？或者，考虑到适当代码的隐含限制，我限制我的用户可以做什么以便遵循“正确”的方式来格式化我的代码？

Answer 1

可以使用style元素的属性:

This is <span style="color: red;">red text</span>.

如果用户仅限于某些选项，您可以使用 class是:

This is <span class="red">red text</span>.

一定要使用语义 HTML 元素:

This is <strong>strong and <em class="blue">emphasized</em></strong>
text with a <a href="http://www.google.com" rel="external">link</a>.

常见语义元素及其用户空间术语:

• <p> (段落)
• <strong> (粗体)
• <em> (斜体)
• <blockquote> (引用)
• <ul>和 <ol>与 <li> (列表)
• 更多...？

在论坛帖子中可能不太常见，但仍然可用的语义元素:

• <h1> , <h2>等(标题；一定要从一个值开始，这样您的页面才有意义)
• <del> ，并且在较小程度上，<ins> (三振)
• <sup>和 <sub> (分别为上标和下标)
• <dl>与 <dt>和 <dd> (成对列表)
• <address> (联系方式)
• 更多...