一.基础认知
1.认识网页
1.1 网页由哪些部分组成？
1.2 程序员所写代码是通过什么转换成网页的？
答案：
1.1 文字、图片、音频、视频、超链接等
1.2 浏览器
2.五大浏览器和渲染引擎
2.1 五大浏览器分别是哪些？
2.2 相同的网页在不同浏览器中显示的效果会完全一致吗？
2.3 前端工程师日常推荐使用哪一个浏览器？
答案：
2.1 IE(Trident)、火狐FireFox(Gecko)、Safari 苹果(Webkit)、欧朋 Opera(Blink)、谷歌 Chrome(Blink)
2.2 不会。因为不同浏览器渲染引擎不同，解析的效果会存在差异
2.3 谷歌浏览器 Chrome
3.Web标准
3.1 Web标准的构成有哪些？分别对应什么语言？
答案：
3.1 结构 —— HTML 页面元素
表现 —— CSS 页面样式
行为 —— JavaScript 页面交互，数据交互
4.HTML感知
4.1 HTML的中文译名是什么？它是编程语言吗？
4.2 HTML中是通过什么来对网页中的文本、图片、音频、视频等内容进行描述的？
答案：
4.1 超文本标记语言；不是编程语言，是标记语言
4.2 HTML标签
5.HTML的基本骨架结构
5.1 HTML骨架结构由哪些标签组成？
答案：
5.1
html标签：网页的整体
head标签：网页的头部
title标签：网页的标题
body标签：网页的内容
6.HTML注释
6.1 注释的快捷键是？
6.2 浏览器会执行注释内容吗？
答案：
6.1 Ctrl + /
6.2 不会，浏览器执行代码时会忽略所有的注释，注释是给程序员看的
7.HTML标签的构成
7.1 常见标签由几部分组成？称之为？
7.2 少数标签由几部分组成？称之为？
7.3 以下标签按照结构划分，分别属于哪一类标签？
答案：
7.1 两部分，开始标签和结束标签；双标签
7.2 一部分，只有开始标签；单标签
7.3 <p>我是标签</p>
< h1 >我是标签</h1>
< hr >
8.HTML标签的属性
8.1 双标签的属性需要写在开始标签还是结束标签中？
8.2 标签上同时存在几个属性？
8.3 标签名与属性之间，属性与属性之间以什么隔开？
答案：
8.1 开始标签
8.2 多个
8.3 空格
9.HTML标签之间的关系
9.1 标签之间的关系可分为哪几种？
9.2 以下标签之间的关系书写错误的是？
A：
<body></body>
B:
< div ><p></p></div>
C:
< title>
D:
<body><div></div></body>
答案：
9.1 父子关系（嵌套关系）、兄弟关系（并列关系）
9.2 C
二.HTML标签学习
1.标题标签
1.1 标题标签一共有几个？分别表示什么含义？
1.2 标题标签有哪些特点？
答案：
1.1
标题共有6个等级，从 h1 到 h6
重要性一次递减
字号依次递减
1.2 文字都有加粗；文字都有变大，但是从h1 ~ h6文字逐渐减小；独占一行
2.段落标签
2.1 段落标签的标签名是？
2.2 段落标签有哪些特点？
答案：
2.1 p标签
2.2 段落之间存在间隙；独占一行
3.换行标签
3.1 换行标签的标签名是？是单还是双标签？作用是什么？
答案：
3.1 br标签；单标签；强制换行
4.水平线标签
4.1 水平线标签的标签名是？是单还是双标签？作用是什么？
答案：
4.1 hr标签；单标签；生成一条水平线
5.文本格式化标签
5.1 文字加粗使用什么标签？
5.2 文字加下划线使用什么标签？
5.3 文字倾斜用什么标签？
5.4 文字删除线用什么标签？
5.5 文本格式化标签都是单还是双标签？
答案：
5.1 strong或b标签
5.2 ins或u标签
5.3 em或i标签
5.4 del或s标签
5.5 文本格式化标签都是双标签；建议使用长标签，因为长标签语义化更强烈
6.图片标签
6.1 在页面中展示一张图片，需要使用什么标签？
6.2 图片常见属性有哪些？分别用来干什么的？
答案：
6.1 img标签
6.2
属性说明
src必须属性，指定需要展示图片的路径
alt替换文本，当图片加载失败时，才显示的文字
title提示文本，当鼠标悬停时，才显示的文字
width图片的宽度
height图片的高度
7.路径
7.1 相对路径有哪三种情况？
答案：
7.1
同级目录 写法 ./目标文件名字
下级目录 写法 ./文件夹名/目标文件名
上级目录 写法 ../目标文件名 注意：一个../表示往上翻越一个层级
8.音频标签
8.1 要在网页中插入音频使用什么标签？
8.2 音频标签有哪些常见属性？
答案：
8.1 audio 标签
8.2
属性作用
src必须属性，指定音频所在的地方/路径
controls显示音频控件
autoplay自动播放，谷歌浏览器设置了没效果，后面会有js解决
loop循环播放
9.视频标签
9.1 要在网页中插入视频使用什么标签？
9.2 视频标签有哪些常见属性？
答案：
9.1 video 标签
9.2
属性作用
src必须属性，视频路径
controls显示视频控件
autoplay自动播放，谷歌浏览器要配合muted属性实现自动静音播放
loop循环播放
10.链接标签
10.1 实现页面跳转需要使用什么标签？
10.2 通过什么属性可以设置a标签到底跳转去哪里？
10.3 通过什么属性可以设置a标签的跳转方式？取值有哪些？
答案：
10.1 链接标签：a 标签
10.2 href属性，必须属性
10.3 target属性，取值1：_self 默认值 在当前窗口中跳转；取值2: _blank 在新窗口中跳转
一.列表标签
1.无序列表
1.1 无序列表由几个标签组成？分别表示什么？
1.2 无序列表标签的嵌套规范是什么？
答案：
1.1
ul标签：表示无序列表的整体；
li标签：表示无序列表的每一项
1.2
ul标签中(亲儿子)子元素只允许嵌套li标签
li标签中可以嵌套任何内容
2.有序列表
2.1 有序列表由几个标签组成？分别表示什么？
2.2 有序列表标签的嵌套规范是什么？
答案：
2.1
ol标签：表示有序列表的整体；
li标签：表示有序列表的每一项
2.2
ol标签中(亲儿子)只能是li标签；
li标签中可以嵌套任何内容
3.自定义列表
3.1 自定义列表由几个标签组成？分别表示什么？
3.2 自定义列表标签的嵌套规范是什么？
答案：
3.1
dl标签：表示自定义列表的整体；
dt标签：表示自定义列表的主题；
dd标签：表示对于主题的每一项内容
3.2
dl标签中只允许嵌套dt/dd标签；
dt/dd标签中可以嵌套任何内容
二.表格标签
1.表格的基本标签
1.1 完成一个简单的表格，需要由几个标签组成？分别表示什么？
1.2 表格基本标签的嵌套规则是什么？
答案：
1.1
table标签：表格整体；
tr标签：表格每行；
td标签：对于主题的每一项内容
1.2 table > tr > td
2.表格相关属性
2.1 给表格添加边框，可以使用什么属性完成？
2.2 设置表格整体的宽高，可以使用什么属性完成？
答案：
2.1 border 属性
2.2
width属性：表格整体的宽度；
height属性：表格整体的高度
3.表格标题和表头单元格标签
3.1 表示表格整体大标题，使用什么标签完成？书写在什么位置？
3.2 在表格第一行设置一列的小标题，使用什么标签完成？书写在什么位置？
答案：
3.1 表格整体大标题：caption 标签，书写在table标签内部
3.2 表头单元格：th标签，书写在tr标签内部
4.表格的结构标签
4.1 表格的结构标签分别有哪些？表示什么含义？
4.2 表格结构标签书写在什么位置？
答案：
4.1
标签含义
thead表格头部
tbody表格主体
tfoot表格底部
4.2 表格结构标签写在table标签内部，用于包裹tr标签
5.合并单元格
5.1 合并单元格的步骤是什么？
5.2 可以跨结构标签合并单元格吗？
答案：
5.1
a：明确合并哪几个单元格；
b：通过左上原则，确定保留谁删除谁
跨行合并(上下合并)——只保留最上的，删除其他多余单元格
跨列合并(左右合并)——只保留最左的，删除其他多余单元格
c：给保留的单元格设置：
rowspan：跨行合并(上下合并)
colspan：跨列合并(左右合并)
5.2 不能
三.表单标签
1. input标签
type属性值描述
text文本框；placeholder 占位符表提示
password密码框，不是以明文显示内容；placeholder 占位符表提示
radio单选按钮，实现多选一；一组radio需要设置相同的name值，实现多选一；checked 默认选中
checkbox复选框，可以选择多个；一组radio需要设置相同的name值，表示同一个分类；checked 默认选中
file文件上传；multiple 可以同时选择多个文件上传
submit提交按钮；可以把数据提交到服务器(服务器编程会再讲)
reset重置按钮；回归到最初的状态
button标签 一般用于做普通按钮，和js一起使用
2.其他表单元素
2.1 select标签 select 包含 option
select：下拉表单的整体
option：下拉表单的每一项
2.2 文本域 textarea标签
textarea注意点：内容与标签写在一行，不要换行否则内容前面会有空格
2.3 label标签
label标签与input联用，增大用户点击范围
方法： 使用label标签将整个input和文字包裹，然后删除掉for属性即可
四.没有语义化的标签
1.常用于无语义化标签有哪两个？各自的特点有哪些？
答案：
1.div：独占一行；span：一行可以显示多个
五.字符实体
空格的字符实体是？
大于号的字符实体是？
小于号的字符实体是？
答案：
1. ；
2.>；
3.<；
