非零基础自学前端最后一遍一 HTML+CSS 3 额外知识补充 3.1 字符实体的作用和常见演练

梦里梦外; 2024-03-25 09:24 26阅读 0赞

#### 非零基础自学前端最后一遍 ####

#### 文章目录 ####

*   *   *  非零基础自学前端最后一遍
         *  一 HTML+CSS
         *  3 额外知识补充
         *   *  3.1 字符实体的作用和常见演练
             *   *  3.1.1 字符实体
                 *  3.1.2 常见的字符实体

![在这里插入图片描述][37cf51f3b07a44c690e09efcfa687899.png_pic_center]

#### 一 HTML+CSS ####

#### 3 额外知识补充 ####

##### 3.1 字符实体的作用和常见演练 #####

###### 3.1.1 字符实体 ######

*  思考：我们编写的HTML代码会被浏览器解析。
 *  如下代码是如何被解析的呢？
    
     *  如果你使用小于号（<），浏览器会将其后的文本解析为一个tag。
     *  但是某些情况下，我们确实需要编写一个小于号（<）；
     *  这个时候我们就可以使用字符实体；
 *  HTML 实体是一段以连字号（&）开头、以分号（;）结尾的文本（字符串）：
    
     *  实体常常用于显示保留字符（这些字符会被解析为 HTML 代码）和不可见的字符（如“不换行空格”）；
     *  你也可以用实体来代替其他难以用标准键盘键入的字符；

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    </head>
    <body>
      <span><Ding Jiaxiong></span>
    </body>
    </html>

![在这里插入图片描述][1a0b3bf727144970986ccc3be73fbefd.png_pic_center]

![在这里插入图片描述][0148e37067d04834b75a4c4493a3a558.png_pic_center]

###### 3.1.2 常见的字符实体 ######

![在这里插入图片描述][24410759e9284aeb8cca78ab9989eb07.png_pic_center]

[37cf51f3b07a44c690e09efcfa687899.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/c3caa288d9bd41ddb70d08d5807ce221.png
[1a0b3bf727144970986ccc3be73fbefd.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/82e12fe647f24d41a971fb931bd9f254.png
[0148e37067d04834b75a4c4493a3a558.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/1b8f6057efdb4453b5d65dbfa4e8dabf.png
[24410759e9284aeb8cca78ab9989eb07.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/7bcf92aeccf84d549e0275a0671b4773.png