参考视频:https://www.bilibili.com/video/BV1kM4y127Li/
HTML是一种超文本(链接)标记(标签)语言。
一、标签语法:
1.双标签(成对出现)如:<strong>...</strong>。
2.单标签(只有开始,没有结束)ru:<br>:换行,<hr>:水平线。
二、HTML基本骨架:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
head:网页头部,用来存放给浏览器看的信息。
body:网页主题,用来存放给用户看到信息。
三、标签的关系:
1.父子关系(嵌套)
2.兄弟关系(并列)
四、标题标签:
一般用在新闻标题、文章标题等。
标签名:h1~h6(双标签)
显示特点:
1.文字加粗.
2.字号逐渐减小.
3.独占一行.
如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
</body>
</html>
五、段落标签:
标签名:p(双标签)
显示特点:
1.独占一行.
2.段落之间存在间隙.
如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段我是第一段</p>
<p>我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段我是第二段</p>
</body>
</html>
六、换行与水平线标签:
1.换行:<br>(单标签)
1.水平线:<hr>(单标签)
如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
我是第一行
<br>
我是第二行
<hr>
</body>
</html>
七、文本格式标签:
作用:为文本添加特殊格式,以突出重点。
标签名:
1.strong/b:加粗
2.em/i:倾斜
3.ins/u:下划线
4.del/s:删除线
如:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- strong/b加粗 -->
<strong>strong加粗</strong>
<!-- 2.em/i倾斜 -->
<em>em倾斜</em>
<!-- 3.ins/u下划线 -->
<ins>ins下划线</ins>
<!-- 4.del/s删除线 -->
<del>del删除线</del>
<hr>
</body>
</html>
八、图像标签:
<img src="图片的url ">
属性:
alt:替换文本(图片无法显示时显示的文字)
title:提示文本(鼠标悬停在图片上显示的文字)
width:图片的宽度(值为数字,没有单位)
height:图片的高度(值为数字,没有单位)
九、超i链接:
<a href="http://www.baidu.com">跳转到百度</a>
target="_blank"新窗口跳转页面
十、音频标签:
<audio src=" 音频url"> </audio>
常见属性:
controls:显示音频控制面板
loop:循环播放
autoplay:自动播放
十一、视频标签:
<video src="视频url"></video>
常见属性:
controls:显示视频控制面板
loop:循环播放
mutel:静音播放
autoplay:自动播放