![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：这么知识点看似简单, 但却对以后进阶影响很大
Collection
Collection
| 序号 | 内容 | 描述 | 备注 |
|---|---|---|---|
| 1 | 网页组成部分 | 1.1 文本内容：呈现出来的具体内容；1.2 其他文件引用，例如文字视频等；1.3 标记，对上述两项内容的正确阐述 | 无 |
| 2 | HTML设计思想 | 2.1 基于标签展示和呈现；2.2 超文本语言：包含有超链接的文本；2.3 HTML并不是编程语言 | 无 |
| 3 | HTML页面结构 | 3.1 <!DOCTYPE html>通知浏览器我是html文档；3.2 <html>...</html>根标签；3.3 <html lang="en"> <html lang="zh-CN">html 文档使用的编写语言；3.4 <head>...</head>供浏览器和搜索引擎使用，用户不感兴趣，不想看到的内容；3.5 <meta>设置页面元素数据；3.6 <meta charset="UTF-8">html 文档编写语言所属的字符编码集，有utf和gbk两种类型；3.7 <meta name="viewport" content="..." /> 其中 name="viewport" 可视区屏幕，例如是否允许缩放这个页面。width=device-width页面宽度应该与显示设备的宽度相匹配，宽带自适应即可。initial-scale=1.0，页面不缩放，1:1呈现；3.8 <title>指定当前页面的标题；3.9 <body>...</body> 页面主体内容；3.10 <!-- 需要注释内容或者代码 -> |
推荐全部使用小写字母 |
| 4 | 元素，属性与值 | 4.1 元素分类非空元素和空元素，非空元素为双标签，例如<a>内容</a>,空元素为单标签，例如图片的引用，<img src="logo.png" alt="我的logo">；4.2 属性和值：属性必须写在元素标签的“起始标签”，有属性名称和值组成；4.3 值包括:字符串<p class="active">...</p>，预定的值<input type="text"> ，指定格式<a href="https://php.cn">...</a>，数值<table width="200">...</table>，布尔值<input type="email" required>；4.4 三大通用属性：id元素的唯一标识，如<div id="wrap">...</div> ，class给元素添加类样式，如<div class="box">...</div>， style设置当前元素样式，如 <div style="...">...</div> |
布尔属性的值是可选的 |
| 5 | 层级关系 | 5.1 元素层级结构中, 必须保持正确的嵌套关系；5.2 元素中允许包含另一个元素,被包含的元素叫做子元素, 子元素又可以继承包含其它元素,依此类推； | 无 |
| 6 | 文本字符 | 6.1 多个空格,制表符,回车符,换行符,都会被压缩为一个空格；6.2 Unicode极大的缓解了特殊字符的问题,推荐将文档编码设置为utf-8；6.3 常用的转义字符：空格nbsp;，小于<，大于>，&&，双引号"，版权©，商标®等等 |
无 |
| 7 | 文件与文件夹名称 | 7.1 使用小写字母；7.2 采用合适的扩展名: .html；7.3 坚持使用连接线-,而不是下划线_分隔多个单词 |
无 |
| 8 | URL | 8.1 语法： http(s)://主机名(IP/域名)/路径(目录)/文件名；8.2 绝对 URL：如http://php.cn/courses/1088.html；8.3 相对 URL，../demo2.html表示位于上级目录的相对位置 |
无 |
| 9 | 标签语义化的优势 | 优点：更直观，突出想要展示的内容，且各大浏览器样式一致；有利于 SEO, 得升关键词优化与排名；提高加载速度,也方便代码维护与样式控制；无障碍支持 | 无 |
| 10 | 元素的默认样式 | 如果代码文档中没有自定义的样式，浏览器将会采用默认样式展示；自定义样式优先级别高于默认样式 | 无 |
