这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
一、本堂课重点内容:
- 介绍了前端是什么、要解决的问题和技术栈等
- 介绍了 HTML 的语义化
- 介绍了常用的 HTML 标签
二、详细知识点介绍:
HTML概念
HTML(Hyper Text Markup Language),即超文本标记语言,是一种标记语言。它包括一系列标签,通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。 HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。HTML文件的扩展名为htm(因为之前的文件系统最多只支持三位扩展名)或html。
常用HTMl标签
<h1~h6></h1~h6> 层级标签
<div></div> 块级元素
<p></p> 段落
<span></span> 包含的文本
<a></a> 超链接文本
<img/> 图片标签
<br/> 换⾏行行
<hr/>⽔水平分割线
<table></table> 表格标签
<tr></tr> 表格的行标签
<td></td> 表格的单元格标签
<ul></ul> ⽆无序列表
<ol></ol> 有序列表
<li></li>列表项
<dl></dl>自定义列表
<dt></dt>自定义列表头
<dd></dd>自定义列表内容
三、实践练习例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>example</title>
</head>
<body>
<h1>HTML标签</h1>
<p></p>
<br/>
<hr/>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>班级</th>
</tr>
<tr>
<td>Lyra</td>
<td>16</td>
<td>Js01</td>
</tr>
</table>
<a href="#">Link</a>
<img src="image.jpg" title="photo" width="800" />
<ul>
<li></li>
<li></li>
</ul>
<ol type="a">
<li></li>
<li></li>
</ol>
</body>
</html>
四、课后个人总结:
想起当初那次寄掉的字节面试,面试官问了一手,谈谈html5脚本的异步加载,鼠鼠常用的只有async,defer只记得有这么个东西,面试官问了我这两个标签的区别,鼠鼠就趴窝了,之后看了这篇W博客文章才了解了defer和async之间的区别,
async和defer都立即开始下载,都不会暂停解析器。async和defer之间的差异在于执行的时间,区别在于async脚本有可能不按照它们在页面中出现的顺序执行,defer脚本按照它们在页面中出现的顺序执行