diff --git a/translated/tech/20220813 Level up your HTML document with CSS.md b/published/20220813 Level up your HTML document with CSS.md similarity index 50% rename from translated/tech/20220813 Level up your HTML document with CSS.md rename to published/20220813 Level up your HTML document with CSS.md index 455ea5497c..37b9fa3695 100644 --- a/translated/tech/20220813 Level up your HTML document with CSS.md +++ b/published/20220813 Level up your HTML document with CSS.md @@ -3,23 +3,26 @@ [#]: author: "Jim Hall https://opensource.com/users/jim-hall" [#]: collector: "lkxed" [#]: translator: "XiaotingHuang22" -[#]: reviewer: " " -[#]: publisher: " " -[#]: url: " " +[#]: reviewer: "wxy" +[#]: publisher: "wxy" +[#]: url: "https://linux.cn/article-15721-1.html" -让 CSS 升级你的 HTML 文档 +使用 CSS 提升你的 HTML 文档 ====== -使用 CSS 让你的 HTML 项目更具风格。 -当你编写文档时，无论是为开源项目还是技术写作项目，你都应该有两个目标：文档应该写得好，同时要易于阅读。 前者通过清晰的写作技巧和技术编辑来解决。第二个目标可以通过对 HTML 文档进行一些简单的更改来解决。 +![][0] -超文本标记语言或 HTML 是互联网的支柱。 自 1994 年“万维网”问世以来，所有网络浏览器都使用 HTML 来显示文档和网站。 几乎与此同时，HTML 一直支持 *stylesheet*，它是对 HTML 文档的一种特殊添加，用于定义文本在屏幕上的呈现方式。 +> 使用 CSS 让你的 HTML 项目更具风格。 -单纯用 HTML 编写项目文档你也可以完成工作。 然而，纯 HTML 样式可能感觉有点简陋。 因此，尝试向 HTML 文档添加一些简单的样式，为文档添加一点活力，并使文档更清晰、更易于阅读。 +当你编写文档时，无论是为开源项目还是技术写作项目，你都应该有两个目标：文档应该写得好，同时要易于阅读。前者通过清晰的写作技巧和技术编辑来解决。第二个目标可以通过对 HTML 文档进行一些简单的更改来解决。 + +超文本标记语言（HTML）是互联网的支柱。自 1994 年“万维网”问世以来，所有网络浏览器都使用 HTML 来显示文档和网站。几乎与此同时，HTML 一直支持样式表，它是对 HTML 文档的一种特殊添加，用于定义文本在屏幕上的呈现方式。 + +单纯用 HTML 编写项目文档也是可以的。然而，纯 HTML 样式可能感觉有点简陋。因此，尝试向 HTML 文档添加一些简单的样式，为文档添加一点活力，并使文档更清晰、更易于阅读。 ### 定义一个 HTML 文档 -让我们从一个纯 HTML 文档开始，探索如何向其添加样式。 一个空的 HTML 文档在顶部包含 定义，后面跟着一个 块来定义文档本身。 在 元素中，你还需要加上一个文档标头，其中包含有关文档的元数据，例如标题。 文档正文的内容放在父 块内的 块中。 +让我们从一个纯 HTML 文档开始，探索如何向其添加样式。一个空的 HTML 文档在顶部包含 `` 定义，后面跟着一个 `` 块来定义文档本身。 在 `` 元素中，你还需要加上一个文档标头，其中包含有关文档的元数据，例如标题。文档正文的内容放在父 `` 块内的 `` 块中。 你可以使用以下 HTML 代码定义一个空白页面： @@ -35,7 +38,7 @@ ``` -在另一篇关于[用 HTML 编写项目文档][2] 的文章中，我将一个开源棋盘游戏的自述文件从纯文本更新为 HTML 文档，并使用一些基本的 HTML 标记，如

和

作为标题和副标题，

用于段落， 和 用于粗体和斜体文本。 让我们从那篇文章结束的地方继续讲： +在另一篇关于 [用 HTML 编写项目文档][2] 的文章中，我将一个开源棋盘游戏的自述文件从纯文本更新为 HTML 文档，并使用一些基本的 HTML 标记，如 `

` 和 `

` 作为标题和副标题，`

` 用于段落，`` 和 `` 用于粗体和斜体文本。让我们从那篇文章结束的地方继续讲： ``` @@ -77,9 +80,9 @@ ``` -此 HTML 文档演示了利用 HTML 的技术写作者经常使用的一些块和内联元素。 块元素在围绕文本定义一个矩形。 段落和标题是块元素的示例，因为它们从文档的左边缘延伸到右边缘。 例如，

在段落周围包含一个不可见的矩形。 相比之下，内联元素的使用则紧跟在它们包围的文本。 如果你在段落中的某些文本上使用 ，则只有被 和 包围的文本会变为粗体。 +此 HTML 文档演示了利用 HTML 的技术写作者经常使用的一些块和内联元素。块元素在围绕文本定义一个矩形。段落和标题就是块元素，因为它们从文档的左边缘延伸到右边缘。例如，`

` 在段落周围包含一个不可见的矩形。相比之下，内联元素的使用则紧跟在它们包围的文本。如果你在段落中的某些文本上使用 ``，则只有被 `` 和 `` 包围的文本会变为粗体。 -You can apply direct styling to this document to change the font, colors, and other text styles, but a more efficient way to modify the document's appearance is to apply a *stylesheet* to the document itself. You can do that in the element, with other metadata. You can reference a file for the style sheet, but for this example, use a