学习前端的不归路——HTML基础

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用来结构化 Web 网页及其内容的标记语言。

知识来源：https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web/HTML_basics

HTML是由一系统的元素组成的

以后的日子要：

一.这个元素的主要部分有：

1. 开始标签（Opening tag）：

   包含元素的名称（本例为 p），被大于号、小于号所包围，元素从这里开始

2. 结束标签（Closing tag）：

   与开始标签相似，只是其在元素名之前包含了一个斜杠，表示元素的结尾 。

3. 内容（Content）：以后的日子要： 元素的内容，本例中就是所输入的文本本身。

4. 元素（Element）：开始标签+结束标签+内容相，这就是一个完整的元素。

二.元素也可以有属性：

以后的日子要：

属性包含了关于元素的一些额外信息，这些信息本身不应显现在内容中。这里，class 是属性名称，editor-note 是属性的值。class 属性可为元素提供一个标识名称，方便进一步为元素指定样式或进行其他操作时使用。

三.属性应该包括：

1. 在属性与元素名称（或上一个属性，如果有超过一个属性的话）之间的空格符。

2. 属性的名称，并接上一个等号。

3. 由引号所包围的属性值。

四.嵌套元素

也可以将一个元素置于其他元素之中 —— 称作嵌套。要表明重点内容，可以将“名字”用 元素包围，将字将突出显示：

亲爱的锐锐小朋友

必须保证元素嵌套次序正确：本例首先使用

标签，然后是 标签，因此要先结束 标签，最后再结束

标签。元素必须正确地开始和结束，才能清楚地显示出正确的嵌套层次。

五.空元素

不包含任何内容的元素称为空元素。比如 元素：

本元素包含两个属性，但是并没有 结束标签，元素里也没有内容。这是因为图像元素不需要通过内容来产生效果，它的作用是向其所在的位置嵌入一个图像。

六.图片

元素通过包含图像文件路径的地址属性 src，可在所在位置嵌入图像。

该元素还包括一个替换文字属性 alt，是图像的描述内容，用于当图像不能被用户看见时显示，不可见的原因可能是：

1. 用户有视觉障碍。视障用户可以使用屏幕阅读器来朗读 alt 属性的内容。

2. 有些错误使图像无法显示。故意将 src 属性里的路径改错。保存并刷新页面就可以在图像位置看到：

width height 可以设置图片的高度和宽度，达到想要的大小

七.标题

类似于书本的篇章，可以有大标题小标题，一般最多用到 3-4 级标题。

   
生日快乐呀 小宝贝
   
一岁一礼 一寸欢喜

八.段落

元素是用来指定段落的，用于指定常规的文本内容。
用于换行，在想换行的位置添加一个即可。突出显示内容。

亲爱的锐锐小朋友，恭喜你经历了春、夏、秋、冬四季轮回，即将开启第二篇章。
很高兴，以小姨的身份认识你。我想，你应该也是高兴的，哈哈哈哈哈哈哈
这世间周而复始，去看去听去体会，去做你自己，做独一无二的你。

九.列表

标记列表通常包括至少两个元素。最常用的列表类型为：

1. 无序列表（Unordered List）中项目的顺序并不重要，例如举例说明。用

   元素。

2. 有序列表（Ordered List）中项目的顺序很重要，例如操作流程。用

   元素。

   列表的每个项目用一个列表项目（List Item）元素

3. 包围。

    
   
      
   健康
      
   平安
      
   快乐
    
   也希望你能够：
    
   
      
   坚强勇敢
      
   善良大方
      
   聪明机智
    
   

   

   十.链接

   元素，a 是 "anchor" （锚）的缩写。

   生日快乐歌

   首先：文案内容

   其次：文案内容 给元素添加了一个 href 属性

   最后：文案内容

   

   十一.html文档详解及最终效果

   
   
     
       
       
     
     
       
   生日快乐呀 小宝贝
       
   一岁一礼 一寸欢喜
   
       
       
   亲爱的锐锐小朋友，恭喜你经历了春、夏、秋、冬四季轮回，即将开启第二篇章。
   很高兴，以小姨的身份认识你。我想，你应该也是高兴的，哈哈哈哈哈哈哈
   这世间周而复始，去看去听去体会，去做你自己，做独一无二的你。
       
   以后的日子要：
       
   
         
   健康
         
   平安
         
   快乐
       
       
   也希望你能够：
       
   
         
   坚强勇敢
         
   善良大方
         
   聪明机智
       
       
   或许世上并没有完美宝宝，可在爱你之人的眼里，你就是这世上最完美的宝宝~
       生日快乐歌
   
     
   

   

   详情：

   • — 文档类型。用于保证文档正常读取。

   • — 元素。该元素包含整个页面的内容，也称作根元素。

   • — 元素。该元素的内容对用户不可见，其中包含例如面向搜索引擎的搜索关键字（keywords）、页面描述、CSS 样式表和字符编码声明等。

   • — 该元素指定文档使用 UTF-8 字符编码。

   • —