html初识
WEB标准
| 构成 | 语言 | 说明 |
|---|---|---|
| 结构 | HTML | 页面元素和内容 |
| 表现 | CSS | 网页元素的外观和位置等页面样式 |
| 行为 | Javascript | 网页模型的定义与页面交互 |
骨架结构
Emment语法
html:5快速生成html骨架结构
文档标识
注
告知浏览器网页采用的HTML版本
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html><html>
注
告知浏览器网页采用的语言
<html lang="zh-cmn-Hans"> // [!code ++]//简体中文，建议不用zh-cn
<html lang="en"> // [!code --]//英文<head>
<meta>
相关信息
meta标签方便网站SEO
<meta charset="UTF-8"> //编码格式
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=7">
<meta name="description" content="教程,html">
<meta name="keywords" content="html"><link>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> //网站小图标
<link rel="stylesheet" href="style.css"> //导入外部css
<link rel="alternate" href="rss.xml" type="application/rss+xml" title="RSS"><style>
<style>
//css代码书写处
</style><title>
<title>网站标题</title><body>
相关信息
常用标签书写处
常用标签
重要
学完后试试腾讯招聘练习
标题
提示
Vscode中使用Ctrl+D多选
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>换行和水平线标签
<br>
<hr> //水平线段落标签
Emmet语法
输入p
<h1>这是文章标题</h1>
<hr>
<p>阿卡贝拉（意大利：Acappella )即无伴奏合唱。 <br> 其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》阿卡贝拉（意大利：Acappella )即无伴奏合唱。其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》阿卡贝拉（意大利：Acappella )即无伴奏合唱。其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》阿卡贝拉（意大利：Acappella )即无伴奏合唱。其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》阿卡贝拉（意大利：Acappella )即无伴奏合唱。其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》阿卡贝拉（意大利：Acappella )即无伴奏合唱。其起源可追溯至中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。音频示例： 阿卡贝拉《千与千寻》</p>
<p>“翻唱”是指将已经发表并由他人演唱的歌曲根据自己的风格重新演唱，包括重新填词，编曲。现在已有不少明星，都在翻唱他人的歌，不断在翻唱中突破自己，给大家带来不一样的风格。视频示例： 有一种悲伤（翻唱）-《A Kind of Sorrow》</p>文本格式化
| 标签 | 说明 |
|---|---|
| b | 加粗 |
| u | 下划线 |
| i | 倾斜 |
| s | 删除线 |
注意
强调语境下使用下列标签
| 标签 | 说明 |
|---|---|
| strong | 加粗 |
| ins | 下划线 |
| em | 倾斜 |
| del | 删除线 |
路径
绝对路径
具体地址，如`C:\Program Files\7-Zip\7-Zip.exe`相对路径
./ //本级目录
../ //上级目录
~/ //根目录媒体
图片
Emmet 语法
img
<img src="/html/dog.gif" alt="">alt：方便视觉障碍者或图片无法加载
视频
Emmet 语法
video
<video src=""></video>controls：显示控制条
loop：循环
音频
Emmet 语法
audio
<audio src=""><audio>链接
Emmet 语法
a
<a href="" target="_self"></a>
<a href="" target="_blank"></a> //新窗口