HTML学习笔记
HTML定义
HTML超文本标记语言
- 超文本是什么？ 链接
- 标记是什么？ 标记也叫标签，带尖括号的文本
标签语法
-
开始标签需要加工的文字结束标签
-
标签成对出现
-
<>里面放标签名
-
结束标签在标签名前加一个’/’
-
拓展
- 双标签：成对出现
- 只有开始，没有结束
HTML骨架
HTML基本骨架是网页模版
<html>
<head>
<title>网页标题</title>
</head>
<body>
网页主体
</body>
<html>
- html：整个网页
- head：网页头部，存放给浏览器看
- body：网页主体，存放给用户看
- title：网页标题
基本语法
标签的关系
作用：明确代码的书写位置
- 父子关系（嵌套关系）
- 兄弟关系（并列关系）
<!--html和其它的是父子级关系-->
<html>
<!--head和body是兄弟关系-->
<head></head>
<body>
</body>
</html>
注释
作用：对代码的解释和说明，易于对程序的理解
格式：<!--文本内容-->
注释不会在浏览器中显示
标题标签
一般用在新闻标题、文章标题、网页区域名称、产品名称等
标签名：h1~h6（双标签）
显示特点：
- 文字加粗
- 字号逐渐减小
- 独占一行
格式：<h1..6>标题</h1..6>
经验分享：
- h1标签一个网页只能用一次，用来放新闻标题或网页的logo
- h2~h6没有使用次数的限制
段落标签
一般用在新闻、文章段落或产品描述信息等等
显示效果：
- 独占一行
- 段落之间有间隙
标签名：p（双标签）
格式：<p>text</p>
换行与水平线标签
换行：<br>
水平线：<hr>
文本格式化标签
作用：为文本添加特殊格式，以突出重点。常见的文本格式：加粗、倾斜、下划线、删除线
| 标签名 | 效果 |
|---|---|
strong | 加粗 |
em | 倾斜 |
ins | 下划线 |
del |
图像标签
作用：在网页中插入图片
格式：<img src="图片的URL" alt="图片不出现显示的文字" title="鼠标悬停在图片上显示的文字">
src用于指定图像的位置和名称，是
<img>的必须属性，图片的URL即图片的路径，在本地上可以使用./表示本文档所在的路径
| 属性 | 作用 | 说明 |
|---|---|---|
| alt | 替换文本 | 图片无法显示的时候显示的文本 |
| title | 提示文本 | 鼠标悬停在图片上的时候显示的文本 |
| width | 图片的宽度 | 值为数字，没有单位 |
| height | 图片的高度 | 值为数字，没有单位 |
路径
路径指的是查找文件时，从起点到终点经历的路线
路径分类：
- 相对路径：从当前文件位置出发查找目标文件
- ./：表示当前文件所在文件夹
- …/：表示进入上一级文件夹
- 绝对路径：从盘符出发查找目标文件
- 绝对路径的应用场景：友情链接，跳到在线网址
超链接
格式：<a href="路径">文本</a>
视频标签
基本格式：<vedio src="视频的URL"></vedio?
常见属性
| 属性 | 作用 | 特殊说明 |
|---|---|---|
| src(必须属性) | 视频URL | 支持格式：MP4、WebM |
| controls | 显示视频控制面板 | |
| loop | 循环播放 | |
| muted | 静音播放 | |
| autoplay | 自动播放 |
<vedio src="" controls loop muted></vedio>
3085
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
