Merge branch 'main' of github.com:Hendry5479/WTF-HTML

# Conflicts: # 04_List/readme.md
seasidejuvenile666 · Oct 7, 2022 · 0740620 · 0740620
2 parents 0a8bd22 + bf10ddc
commit 0740620
Show file tree

Hide file tree

Showing 11 changed files with 74 additions and 17 deletions.
diff --git a/01_HelloHTML/readme.md b/01_HelloHTML/readme.md
@@ -1,6 +1,6 @@
 # WTF HTML极简教程: 1. Hello HTML （9行代码）
 
-WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML)，帮助新人快速入门HTML。
 
 **推特**：[@WTFAcademy_](https://twitter.com/WTFAcademy_)  ｜ [@0xAA_Science](https://twitter.com/0xAA_Science) 
 

diff --git a/02_Element/readme.md b/02_Element/readme.md
@@ -1,6 +1,6 @@
 # WTF HTML极简教程: 2. Element
 
-WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML)，帮助新人快速入门HTML。
 
 **推特**：[@WTFAcademy_](https://twitter.com/WTFAcademy_)  ｜ [@0xAA_Science](https://twitter.com/0xAA_Science) 
 
@@ -10,7 +10,7 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 ---
 
-这一讲，我们将在上一讲的基础上，具体分析HTML中的元素。你也可以直接阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics)。
+这一讲，我们将在上一讲的基础上，具体分析HTML中的元素。
 
 
 ## 元素的属性
@@ -104,4 +104,4 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 ## 总结
 
-这一讲我们具体分析了HTML中的元素，包括元素的属性、嵌套元素、空元素、块级元素和行内元素。
+这一讲我们具体分析了HTML中的元素，包括元素的属性、嵌套元素、空元素、块级元素和行内元素。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics)。
diff --git a/03_Text/index.html b/03_Text/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<head>
+    <title>Text</title>
+</head>
+<body>
+    <h1>主标题</h1>
+    <h2>顶层标题</h2>
+    <h3>子标题</h3>
+    <h4>次子标题</h4>
+
+    <p>我是一个段落，千真万确。</p>
+
+    <p><span>一些文字</span></p>
+
+    Mozilla Foundation<br>
+    1981 Landings Drive<br>
+    Building K<br>
+    Mountain View, CA 94043-0801<br>
+
+    <p>I am <em>glad</em> you weren't <em>late</em>.</p>
+
+    <p>This liquid is <strong>highly toxic</strong>.</p>
+    <p>I am counting on you. <strong>Do not</strong> be late!</p>
+</body>
+</html>
diff --git a/03_Text/readme.md b/03_Text/readme.md
@@ -10,7 +10,7 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 ---
 
-这一讲，我们介绍常用的文本标记 HTML 元素。
+这一讲，我们介绍常用的文本标记 HTML 元素。你也可以直接阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics)。
 
 ## `<h1>-<h6>`
 
@@ -100,3 +100,5 @@ I am counting on you. **Do not** be late!
 ## 总结
 
 这一讲我们介绍了如何在 HTML 中标记文本，并介绍了一些最重要的元素。在这一领域还有许多语义元素，我们将在后面的文章中看到更多的语义元素。
+
+更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals)。
diff --git a/04_List/readme.md b/04_List/readme.md
@@ -1,6 +1,6 @@
 # WTF HTML极简教程: 4. 列表
 
-WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML)，帮助新人快速入门HTML。
 
 **推特**：[@WTFAcademy_](https://twitter.com/WTFAcademy_)  ｜ [@0xAA_Science](https://twitter.com/0xAA_Science)
 
@@ -10,10 +10,12 @@ WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/
 
 ---
 
-在这一讲我们将介绍HTML的常用元素：列表和[表格](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/table)。
+在这一讲我们将介绍HTML的常用元素：列表和[表格](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/table)。你也可以直接阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics)。
 
 ## 列表
 
+
+## 无序列表ul（unordered lists）
 列表包含三种类型：[无序列表](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/ul)、[有序列表](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/ol)、[定义列表](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/dl)。
 
 ### 无序列表ul（unordered lists）
@@ -257,4 +259,4 @@ WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/
 
 ## 总结
 
-这一讲介绍了html的常用元素列表以及三种列表类型，还有表格的基本使用和合并表格的方式。
+这一讲介绍了html的常用元素列表以及三种列表类型，还有表格的基本使用和合并表格的方式。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals)。
diff --git a/05_Form/readme.md b/05_Form/readme.md
@@ -1,6 +1,6 @@
 # WTF HTML极简教程: 5. 表单
 
-WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML)，帮助新人快速入门HTML。
 
 **推特**：[@WTFAcademy_](https://twitter.com/WTFAcademy_)  ｜ [@0xAA_Science](https://twitter.com/0xAA_Science)
 
@@ -141,4 +141,4 @@ method：定义表单数据的提交方式，可以是以下值：
 
 ## 总结
 
-这一讲我们介绍了HTML常用元素表单以及其常见的表单元素。
+这一讲我们介绍了HTML常用元素表单以及其常见的表单元素。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Tables)。
diff --git a/06_Hyperlink/index.html b/06_Hyperlink/index.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<head>
+    <title>Hyperlink</title>
+</head>
+<body>
+    <p>我创建了一个指向
+        <a href="https://wtf.academy/">WTFAcademy 主页</a>的超链接。
+    </p>
+
+    <p>我创建了一个指向
+        <a href="https://wtf.academy/" title="面向Web2开发者的Web3开源学院。">WTFAcademy 主页</a>的超链接。
+    </p>
+
+    <a href="https://wtf.academy/">外部链接</a>
+
+    <a href="#什么是超链接？">相同页面链接的描述</a>
+
+    <a href="https://wtf.academy/">
+        <img src="https://wtf.academy/img/wtflogo.png" alt="WTFAcademy logo" />
+    </a>
+
+    <a href="mailto:nowhere@mozilla.org">Send email to nowhere</a>
+
+    <a href="tel:+491570156">+49 157 0156</a>
+
+    <a href="./img/6-2.png" download="wtflogo">下载 WTFAcademy logo</a>
+</body>
+</html>
diff --git a/06_Hyperlink/readme.md b/06_Hyperlink/readme.md
@@ -1,6 +1,6 @@
 # WTF HTML极简教程: 6. Hyperlink 超链接
 
-WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程](https://developer.mozilla.org/zh-CN/docs/Learn/HTML)，帮助新人快速入门HTML。
 
 **推特**：[@WTFAcademy_](https://twitter.com/WTFAcademy_)  ｜ [@0xAA_Science](https://twitter.com/0xAA_Science) 
 
@@ -119,4 +119,4 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 ## 总结
 
-这一讲我们介绍了超链接的概念，创建超链接使用的标签，以及不同种类的链接。
+这一讲我们介绍了超链接的概念，创建超链接使用的标签，以及不同种类的链接。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks)。
diff --git a/07_Img/readme.md b/07_Img/readme.md
@@ -70,4 +70,4 @@ height（高度）与 width（宽度）属性用于设置图像的高度与宽
 不过我们通常不会在 `<img>` 元素中直接设置宽度与高度，后续学习过CSS后，我们一般通过CSS来指定图像的宽度与高度。
 
 ## 总结
-这一讲我们学习了如何通过img标签在页面中嵌入图像，以及它的常用属性。
+这一讲我们学习了如何通过img标签在页面中嵌入图像，以及它的常用属性。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Multimedia_and_embedding/Images_in_HTML)。
diff --git a/08_SemanticElements/readme.md b/08_SemanticElements/readme.md
@@ -95,4 +95,4 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 ## 总结
 
-这一讲我们介绍了一些常用的语义元素，它们无论是对于开发者还是机器而言都是很重要的，在编写页面时我们要经常使用这些语义元素。
+这一讲我们介绍了一些常用的语义元素，它们无论是对于开发者还是机器而言都是很重要的，在编写页面时我们要经常使用这些语义元素。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure)。
diff --git a/README.md b/README.md
@@ -1,6 +1,6 @@
 # WTF-HTML
 
-WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML。
+WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org/zh-CN/docs/Learn/HTML))，帮助新人快速入门HTML，并完成一个极简版[Uniswap页面](https://github.com/WTFAcademy/WTF-HTML/blob/main/09_UniswapHTML/readme.md)。
 
 ---
 
@@ -16,9 +16,9 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org
 
 **第3讲：常用文本标签** ：【[代码](https://github.com/WTFAcademy/WTF-HTML/blob/main/03_Text)】 【[教程](https://github.com/WTFAcademy/WTF-HTML/blob/main/03_Text/readme.md)】
 
-**第4讲：列表**
+**第4讲：列表** ：【[代码](https://github.com/WTFAcademy/WTF-HTML/blob/main/04_List)】 【[教程](https://github.com/WTFAcademy/WTF-HTML/blob/main/04_List/readme.md)】
 
-**第5讲：表单**
+**第5讲：表单** ：【[代码](https://github.com/WTFAcademy/WTF-HTML/blob/main/05_Form)】 【[教程](https://github.com/WTFAcademy/WTF-HTML/blob/main/05_Form/readme.md)】
 
 **第6讲：超链接** ：【[代码](https://github.com/WTFAcademy/WTF-HTML/blob/main/06_Hyperlink)】 【[教程](https://github.com/WTFAcademy/WTF-HTML/blob/main/06_Hyperlink/readme.md)】
Original file line number	Diff line number	Diff line change
Expand Up		@@ -95,4 +95,4 @@ WTF HTML教程，总结/搬运自[MDN HTML教程]((https://developer.mozilla.org

		## 总结

		这一讲我们介绍了一些常用的语义元素，它们无论是对于开发者还是机器而言都是很重要的，在编写页面时我们要经常使用这些语义元素。
		这一讲我们介绍了一些常用的语义元素，它们无论是对于开发者还是机器而言都是很重要的，在编写页面时我们要经常使用这些语义元素。更详细内容你可以阅读[MDN HTML基础](https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure)。