小白学前端第二周笔记
学习时间：2026/4/1-4/7
学习资源：b站“黑马程序员”前端Web开发HTML5/CSS3+移动web视频教程（第12-27集）
学习工具：VS Code+谷歌浏览器
一、本周学习的核心知识点
1.超链接
- 作用：单击跳转到其他页面。
- 对应标签：
<a href="相对路径/绝对路径/#" target="_blank">填写路径的名称或者描述等<a> - 跳到本地文件使用相对路径（./)
- target="_blank"新窗口跳转页面
- 开发初期，不知道超链接跳转的地址，可以使用#号代替，后期有地址时再进行补充即可。
2.音频与视频标签（超喜欢）
- 音频的标签：
<audio src="音频的URL"></audio> - 视频的标签：
<video src="视频的URL"></video> - 属性：（1）.src(必须属性）控制音频URL，支持MP3、Ogg、Wav;(2).Controls显示控制面板；（3）.loop循环播放；（4）.autoplay自动播放（网页一般禁用音频自动播放，视频在静音的状态下可以自动播放。）；（5）.muted静音播放（视频特有）
3.列表
- 布局内容排列整齐的区域。
- 分类：无序、有序、定义
- 无序标签：ul嵌套li，ul是无序列表，li是列表条目。
- 有序列表：ol嵌套li，同上
- 定义列表：dl嵌套dt与dd，dl是定义列表，dt是定义列表标题，dd是定义列表的描述/详情。
- 呈现效果：
4.表格标签以及合并单元格
- table嵌套tr，tr嵌套td/th
- table表格、tr行、th表头单元格（thead）、td内容单元格（tbody）、tfoot表格底部汇总区域。
- 表格默认没有边框，使用border属性可以加边框：
<table border="1"> - 合并单元格：（1）.跨行保留最上面的，添加属性rowspan;（2）.跨列保留最左边的，添加属性colspan；（3）.最后删掉合并的其他单元格
5.表单的input标签
- type属性值不同，则功能不同。
- 文本框text、密码框password（不能换行）、单选框radio、多选框checkbox、上传文件file
- 占位文本：
<input type="text/password" placeholder="提示信息">
- 单选框radio——常用属性name：控名称、控分组，同组只能选一个（单选）
- checked默认选中
- 多选框/复选框 checkbox
- （1）.默认选中：checked；（2）.
<input type="checkbox" checked>
- 上传文件 file
- 添加multiple表示可以同时上传多个文件。
- 下拉菜单 select
- select嵌套option，select是下拉菜单整体，option是菜单内容。
- 文本域（textarea）：多行输入的文本表单控件。
- lable标签：扩大点击范围
- 方法一：（1）.lable标签只包裹内容，不包裹表单控件。（2）.放lable标签的for属性和表单控件的id属性相同。
- 方法二：使用lable标签包裹住文字的表单控件，不需要属性。
- 表单按钮(button）
- `按钮
- =submit时，表提交到后台（无设置时，默认属性）
- =reset时，重置（一键清除）且需要配合form使用
6.无语义与字符实体
- 无语义的布局标签：划分网页区域，摆放内容。
- div与span
- 字符实体：显示网页预留字符，网页有些字符无法直接识别到，就需要用到的功能。
- 空格：
 ，no-break space即不换行空格，键盘中的空格键无论按多少个也只能显示一个， 想要多少个就打多少个。 - 小于号：
< - 大于号：
>
二、本周遇到的问题
- 暂时没有遇到，我觉得现在这个阶段更加重要的多多练习，而目前面临最大的问题是遗忘，时间太有限，码字以及对电脑的熟练程度远远不够，导致自己学习练习的时间太紧凑。
- 另外的问题是掘金APP的使用，我现在采用电脑在线编辑，可以实时监控自己码出的效果，手机是无法把握的。解决在掘金做学习记录的问题确实很有成就感。这就是技术人员攻克难题时的感受吗？！简直太棒了！！
三、本周的快捷键
VS Code 快捷键复习
- alt+z 自动换行
- ctrl+x 剪切
- ctrl+z 撤销
- alt+shit+↓ 复制到下一行（超级好用）
四、下周计划
复习+拿下CSS基础（颜色、字体、盒模型） gogogo！！！！！
五、总结
本周没有遇到特别卡的问题，知识点比较基础。但我知道这只是开始，后面会越来越难。如果有前辈发现我有理解偏差或者问题，请一定指正我，拜托了。
鹿鹿 2026.04.08 23：21
