Hypertext Markup Language (English: Hyper Text Markup Language, HTML for short) is a markup language used to structure Web pages and their content .
Knowledge source: https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics
HTML is made up of a system of elements
<p>以后的日子要：</p>1. The main parts of this element are:
Opening tag : <p> contains the name of the element (p in this example), surrounded by greater than and less than signs, where the element begins
Closing tag : </p> is similar to the opening tag, except that it contains a slash before the element name, indicating the end of the element.
Content : In the days to come: The content of the element, which in this case is the entered text itself.
Element (Element): start tag + end tag + content phase, this is a complete element.
2. Elements can also have attributes:
<p class=“editor-note”>以后的日子要：</p>Attributes contain additional information about the element that should not appear in the content itself. Here, class is the attribute name and editor-note is the value of the attribute. The class attribute can provide an identification name for the element, which is convenient for further specifying styles for the element or performing other operations.
3. Attributes should include:
Space between the attribute and the element name (or the previous attribute, if there is more than one attribute).
The name of the attribute followed by an equals sign.
The attribute value surrounded by quotation marks.
4. Nested elements
It is also possible to place an element inside other elements - this is called nesting . To indicate important content, you can surround "name" with <strong> elements, and the words will be highlighted:
<p>亲爱的<strong>锐锐</strong>小朋友</p>The elements must be nested in the correct order : In this example, the <p> tag is used first , followed by the <strong> tag, so the <strong> tag should be closed first, and the <p> tag should be closed last. Elements must start and end correctly to clearly show the correct nesting level.
5. Empty elements
An element that contains no content is called an empty element. For example the <img> element:
<img src="images/tutu.png" alt="My test image" />This element contains two attributes, but there is no </img> closing tag, and there is no content in the element. This is because the image element does not need content to be effective, its function is to embed an image in its place.
6. Pictures
The <img> element can embed an image at its location through the src attribute containing the path to the image file.
<img src="images/children.jpg" width="540" height="324" alt="picture" />This element also includes a replacement text attribute alt, which is the description content of the image and is used to display when the image cannot be seen by the user. The reason for the invisibility may be:
The user is visually impaired. Visually impaired users can use a screen reader to read the contents of the alt attribute aloud.
Some bugs prevent images from being displayed. Intentionally change the path in the src attribute wrong. Save and refresh the page to see in the image location:
width height You can set the height and width of the picture to achieve the desired size
7. Title
<h>Similar to book chapters, there can be large titles and small titles, and generally 3-4 level titles are used at most.
<h1>生日快乐呀 小宝贝</h2>
<h2>一岁一礼 一寸欢喜</h2>
8. Paragraph
The <p> element is used to specify paragraphs, which are used to specify regular text content. <br> is used for line break, just add one at the position where you want to break the line. <strong>Highlight content.
<p>亲爱的<strong>锐锐</strong>小朋友，恭喜你经历了春、夏、秋、冬四季轮回，即将开启第二篇章。<br>很高兴，以小姨的身份认识你。我想，你应该也是高兴的，哈哈哈哈哈哈哈<br>这世间周而复始，去看去听去体会，去做你自己，做独一无二的你。</p>
Nine. List
Markup lists typically consist of at least two elements. The most commonly used list types are:
The order of items in an Unordered List doesn't matter, for example. Use the <ul> element.
The order of the items in an Ordered List is important, such as a flow of operations. Use the <ol> element.
Each item of the list is surrounded by a list item (List Item) element <li>.
<ul>
<li>健康</li>
<li>平安</li>
<li>快乐</li>
</ul>
<p>也希望你能够：</p>
<ol>
<li>坚强勇敢</li>
<li>善良大方</li>
<li>聪明机智</li>
</ol>
10. Links
The <a> element, where a is short for "anchor".
<a href="https://blog.csdn.net/maowenbei/article/details/108617640">生日快乐歌</a>First: <a>copy content</a>
Second: <a href="">copy content</a> adds an href attribute to the element
Finally: <a href="web link">copy content</a>
Eleven.html document detailed explanation and final effect
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>周岁宴</title>
</head>
<body>
<h1>生日快乐呀 小宝贝</h2>
<h2>一岁一礼 一寸欢喜</h2>
<img src="images/children.jpg" width="540" height="324" alt="picture" />
<p>亲爱的<strong>锐锐</strong>小朋友，恭喜你经历了春、夏、秋、冬四季轮回，即将开启第二篇章。<br>很高兴，以小姨的身份认识你。我想，你应该也是高兴的，哈哈哈哈哈哈哈<br>这世间周而复始，去看去听去体会，去做你自己，做独一无二的你。</p>
<p>以后的日子要：</p>
<ul>
<li>健康</li>
<li>平安</li>
<li>快乐</li>
</ul>
<p>也希望你能够：</p>
<ol>
<li>坚强勇敢</li>
<li>善良大方</li>
<li>聪明机智</li>
</ol>
<p>或许世上并没有完美宝宝，可在爱你之人的眼里，你就是这世上最完美的宝宝~</p>
<a href="https://y.qq.com/n/ryqq/singer/0012Y31J1bKIDK">生日快乐歌</a>
</body>
</html>
Details:
<!DOCTYPE html> — Document type. It is used to ensure that the document can be read normally.
<html></html> — The <html> element. This element contains the content of the entire page and is also known as the root element.
<head></head> — The <head> element. The content of this element is invisible to the user, which includes, for example, search engine-oriented search keywords ( keywords ), page description, CSS style sheet, and character encoding declaration.
<meta charset="utf-8"> — This element specifies that the document uses UTF-8 character encoding.
<title></title> — <title> 元素。该元素设置页面的标题，显示在浏览器标签页上，也作为收藏网页的描述文字。
<body></body> — <body> 元素。该元素包含期望让用户在访问页面时看到的内容，包括文本、图像、视频、游戏、可播放的音轨或其他内容。