let myButton = document.querySelector('button');
let myHeading = document.querySelector('h1');
- function setUserName() {
let myName = prompt('请输入你的名字。');
localStorage.setItem('name', myName);
diff --git a/files/zh-cn/learn/html/introduction_to_html/index.html b/files/zh-cn/learn/html/introduction_to_html/index.html
index 4452927531..65a460db43 100644
--- a/files/zh-cn/learn/html/introduction_to_html/index.html
+++ b/files/zh-cn/learn/html/introduction_to_html/index.html
@@ -55,7 +55,7 @@ translation_of: Learn/HTML/Introduction_to_HTML
相关链接
恭喜你，迈出了探索 JavaScript 世界的第一步。我们从理论开始，介绍为什么要使用 JavaScript，以及用它能做什么事情。过程中穿插了一些代码示例并讲解了 JavaScript 如何与网站中其他代码适配，等等。
-现在 JavaScript 或许还有些令人生畏，但不用担心。在课程中我们会循序渐进。下一节将 全力投入实战，让你专注其中，并建立自己的 JavaScript 示例。
+现在 JavaScript 或许还有些令人生畏，但不用担心。在课程中我们会循序渐进。下一节将 全力投入实战，让你专注其中，并建立自己的 JavaScript 示例。
{{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}
-- cgit v1.2.3-54-g00ecf From aa753656fb9cab430100756008e519f3c1c61dc8 Mon Sep 17 00:00:00 2001 From: Flex Zhong{{PreviousMenuNext("Learn/CSS/First_steps/What_is_CSS", "Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps")}}
-在这篇文章中，我们将会拿一个简单的HTML文档做例子，并且在上边使用CSS样式，期待你能在此过程中学会更多有关CSS的实战性知识。
+在这篇文章中，我们将会拿一个简单的 HTML 文档做例子，并且在里面使用 CSS 样式，期待你能在此过程中学会更多有关 CSS 的实战性知识。
我们先以HTML文档展开叙述。如果想在自己电脑试一试，可以copy下面的代码。在你的电脑上，将代码以文件名： index.html 的形式保存下来。
我们先以 HTML 文档展开叙述。如果想在自己电脑试一试，可以复制下面的代码。在你的电脑上，将代码以文件名： index.html 的形式保存下来。
<!doctype html> <html lang="en"> @@ -71,25 +71,25 @@ original_slug: Learn/CSS/First_steps/开始-温馨提示：假设你电脑操作环境不方便创建文件运行代码，别担心，可以用我们下方给出的在线实时代码编辑器。
-添加CSS试试看？
+添加 CSS 试试看？
-我们最想做的就是让HTML文档能够遵守我们给它的CSS规则。 其实有三种方式可以实现，而目前我们更倾向于利用最普遍且有用的方式——在文档的开头链接CSS。
+我们最想做的就是让 HTML 文档能够遵守我们给它的 CSS 规则。 其实有三种方式可以实现，而目前我们更倾向于利用最普遍且有用的方式——在文档的开头链接 CSS。
-在与之前所说的HTML文档的相同目录创建一个文件，保存并命名为
+styles.css。（看后缀知道此文件就是CSS文件）在与之前所说的 HTML 文档的相同目录创建一个文件，保存并命名为
-styles.css。（看后缀知道此文件就是 CSS 文件）为了把
+styles.css和index.html联结起来，可以在HTML文档中，{{htmlelement("head")}}语句模块里面加上下面的代码：为了把
styles.css和index.html连接起来，可以在 HTML 文档中，{{htmlelement("head")}} 语句模块里面加上下面的代码：<link rel="stylesheet" href="styles.css">-{{htmlelement("link")}} 语句块里面，我们用属性
+rel，让浏览器知道有CSS文档存在（所以需要遵守CSS样式的规定），并利用属性href指定，寻找CSS文件的位置。 你可以做测试来验证CSS是否有效：在styles.css里面加上CSS样式并观察显示的结果。下面，用你的编辑器打出下面的代码。{{htmlelement("link")}} 语句块里面，我们用属性
rel，让浏览器知道有 CSS 文档存在（所以需要遵守 CSS 样式的规定），并利用属性href指定，寻找 CSS 文件的位置。 你可以做测试来验证CSS是否有效：在styles.css里面加上CSS样式并观察显示的结果。下面，用你的编辑器打出下面的代码。h1 { color: red; }-保存HTML和CSS文档，刷新浏览器网页，不出意外你将看到网页顶层的大标题变成红色了。如果看到这个现象，我得恭喜你：你已经成功将某些CSS样式运用到HTML上了。当然假设没有达到预想结果，可以仔细检查每句代码是否正确，加油：）
+保存 HTML 和 CSS 文档，刷新浏览器网页，不出意外你将看到网页顶层的大标题变成红色了。如果看到这个现象，恭喜你：你已经成功将某些 CSS 样式运用到 HTML 上了。当然假设没有达到预想结果，可以仔细检查每句代码是否正确，加油：）
-你可以一直在本地编辑器练习
+styles.css，或者采用我们教程下面的交互式智能编辑器。这个编辑器会默认把第一个面板里面的CSS代码联结到旁边的HTML文档，就好像我们上面得两个文档一样互相联结。你可以一直在本地编辑器练习
styles.css，或者采用我们教程下面的交互式智能编辑器。这个编辑器会默认把第一个面板里面的 CSS 代码连接到旁边的 HTML 文档，就好像我们上面得两个文档一样互相连接。样式化 HTML 元素
@@ -177,7 +177,7 @@ span.special {该选择器将选择
-<li>内部的任何<em>元素（<li>的后代）。因此在示例文档中，您应该发现第三个列表项内的<em>现在是紫色，但是在段落内的那个没发生变化。另一些可能想尝试的事情是在HTML文档中设置直接出现在标题后面并且与标题具有相同层级的段落样式，为此需在两个选择器之间添加一个
++号 (成为 相邻选择符)另一些可能想尝试的事情是在 HTML 文档中设置直接出现在标题后面并且与标题具有相同层级的段落样式，为此需在两个选择器之间添加一个
+号 (成为 相邻选择符)也将这个规则添加到样式表中：
@@ -185,7 +185,7 @@ span.special { font-size: 200%; }
下面的示例包含了上面的两个规则。 尝试添加规则使位于段落中的span变为红色。如果正确您将看到在第一段中的span会变为红色，但是第一个列表项中的span不会改变颜色。
+下面的示例包含了上面的两个规则。 尝试添加规则使位于段落中的 span 变为红色。如果没问题，您将看到在第一段中的 span 会变为红色，但是第一个列表项中的 span 不会改变颜色。
{{EmbedGHLiveSample("css-examples/learn/getting-started/started2.html", '100%', 1100)}}
@@ -211,18 +211,18 @@ a:visited { text-decoration: none; } -在下面的例子中，你可以对超链接的不同状态尝试各种各样的值。我已经编写了一些规则，然而你肯定已经发现粉色看上去太浅以至于不好辨认。— 换个更好的颜色吧。你能将链接变为黑体吗?
+在下面的例子中，你可以对超链接的不同状态尝试各种各样的值。我已经编写了一些规则，然而你肯定已经发现粉色看上去太浅以至于不好辨认。——换一个更好的颜色吧。你能将链接变为黑体吗?
{{EmbedGHLiveSample("css-examples/learn/getting-started/started3.html", '100%', 900)}}
-我们对鼠标悬停于链接上的情况删除了下划线。你当然可以让超链接在任何情况下都没有下划线.。但需要注意的是，对一个实际的站点，需要让浏览者知道“链接是链接”。为了让浏览者注意到一段文字中的某些部分是可点击的，最好保留link状态下的下划线。— 这是下划线的本来作用。不管你用CSS来做什么，都应当使得变化后的文档看上去更加清晰明了。— 在后面，当我们遇到类似的情况时，我们将适时指出。
+我们对鼠标悬停于链接上的情况删除了下划线。你当然可以让超链接在任何情况下都没有下划线。但需要注意的是，对一个实际的站点，需要让浏览者知道“链接是链接”。为了让浏览者注意到一段文字中的某些部分是可点击的，最好保留 link 状态下的下划线。— 这是下划线的本来作用。不管你用 CSS 来做什么，都应当使得变化后的文档看上去更加清晰明了。— 在后面，当我们遇到类似的情况时，我们将适时指出。
注: 在本教程以及整个MDN站点中，你会经常看到“无障碍”这个词。“无障碍”一词的意思是，我们的网页应当每一个访客都能够理解、使用。
+注: 在本教程以及整个 MDN 站点中，你会经常看到“无障碍”这个词。“无障碍”一词的意思是，我们的网页应当让每一个访客都能够理解、使用。
你的访客可能在一台使用鼠标和键盘操作的计算机前，也可能正在使用带有触摸屏的手机，或者正在使用屏幕阅读软件读出文档内容，或者他们需要使用更大的字体，或者仅仅使用键盘浏览站点。
-一个朴素的HTML文档一般来说对任何人都是可以无障碍访问的 ，当你开始为它添加样式，记得不要破坏这种可访问性。
+一个朴素的 HTML 文档一般来说对任何人都是可以无障碍访问的 ，当你开始为它添加样式，记得不要破坏这种可访问性。
上面的代码为以下元素建立样式：在<body>之内，紧接在<h1>后面的<p>元素的内部，类名为special。
+上面的代码为以下元素建立样式：在<body>之内，紧接在<h1>后面的<p>元素的内部，类名为 special。
-在我们提供的原始HTML文档中，与之符合的元素只有<span class="special">.
在我们提供的原始 HTML 文档中，与之符合的元素只有<span class="special">.
如果你现在觉得这份代码太复杂了，别担心，— 一旦你开始编写更多的CSS代码，你很快就能找到窍门。
+如果你现在觉得这份代码太复杂了，别担心，— 一旦你开始编写更多的 CSS 代码，你很快就能找到窍门。
在本教程中，我们学习了使用CSS为文档添加样式的几种方法。在教程的剩下部分，我们将继续这个话题。不过，你现在已经有了足够的知识为文本建立样式；根据目标元素的不同用不同的方式应用样式；在MDN文档中查找属性和值。
+在本教程中，我们学习了使用 CSS 为文档添加样式的几种方法。在教程的剩下部分，我们将继续这个话题。不过，你现在已经有了足够的知识为文本建立样式；根据目标元素的不同用不同的方式应用样式；在 MDN 文档中查找属性和值。
在下一节中，我们将看到样式表的结构是什么样的。
@@ -260,9 +260,9 @@ h1 + ul + p { ... }但是，在我们使用类选择器和元素选择器的早期块中，类将获胜，使得段落变红--即使它出现在样式表的前面。一个类被描述为比元素选择器更具体，或者具有更多的特异性，所以它获胜了。
+但是，在我们同时使用了类选择器和元素选择器的前一个例子中，类将获胜，使得段落变红--即使它出现在样式表的前面。一个类被描述为比元素选择器更具体，或者具有更多的特异性，所以它获胜了。
自己试试上面的实验--将HTML添加到您的实验中，然后将两个p{.}规则添加到样式表中。接下来，将第一个p选择器更改为.Special，以查看它如何更改样式。
-- cgit v1.2.3-54-g00ecf From c5e7f70a3ad8e59d006e019d5fba4ddacf5664b7 Mon Sep 17 00:00:00 2001 From: Zen&CS <35493996+smallnine9@users.noreply.github.com> Date: Mon, 30 Aug 2021 21:40:15 +0800 Subject: Improve Learn/CSS/First_steps/Getting_started, zh-CN (#2277) --- files/zh-cn/learn/css/first_steps/getting_started/index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'files/zh-cn/learn') diff --git a/files/zh-cn/learn/css/first_steps/getting_started/index.html b/files/zh-cn/learn/css/first_steps/getting_started/index.html index 7b8a7aacd8..a4c358224a 100644 --- a/files/zh-cn/learn/css/first_steps/getting_started/index.html +++ b/files/zh-cn/learn/css/first_steps/getting_started/index.html @@ -225,9 +225,9 @@ a:visited {一个朴素的 HTML 文档一般来说对任何人都是可以无障碍访问的 ，当你开始为它添加样式，记得不要破坏这种可访问性。
-你可以将多个选择子和关系选择器组合起来。来看一些例子：
+你可以同时使用选择器和选择符。来看一些例子：
/* selects any <span> that is inside a <p>, which is inside an <article> */
article p span { ... }
--
cgit v1.2.3-54-g00ecf