HTML
html记录
HTML
基础元素
开始
使用<html lang="语言"></html>来开始
<!DOCTYPE html> 说明为最新版本html<html lang="zh"> 使用中文为页面语言</html>定义标题
使用<h1> </h1>来定义多级标题
<h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3>…同样的，html只有6级标题段落
使用<p> </p>来定义段落，而如果不需要换行就直接输入就可以了
<p>这是段落，会自动换行</p>事实上并没有什么用…值得一提的是，两个<p> </p>标签之间在换行与不换行的情况有略微不同：
<p>段一</p><p>段二</p>这种如果将两个均占50%宽度会换行（两元素之间会有小空格）
<p>段一</p><p>段二</p>这种不会（两元素之间没有小空格）分节
使用<section></section>对网页或应用程序中的内容进行分组独立区域，通常包含一个标题.一个section就是一个小节
分块
使用<fieldset></fieldset>对网页中分块，<legend></legend>可以对块起名字
<fieldset> <legend>块名</legend> 这是一块</fieldset>示例：
文章
<article></article>元素代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容
分组
使用<div id="id"></div>对网页或应用程序中的内容进行分组独立区域主要以配合css
分隔符
<hr>元素定义分隔符，等同于markdown的*****：
超链接
使用<a href="链接"> 链接文字 </a>来定义超链接
<p><a href="https://baidu.com"> 百度 </a>是一个搜索引擎</p>示例：
百度 是一个搜索引擎
src和href
href（Hypertext Reference） src（Source）
href指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的联系。在请求src 资源时会将其指向的资源下载并应用到文档中，比如JavaScript脚本，img图片；
href用于在当前文档和引用资源之间确立联系；src用于替换当前内容；
- src：用于需要嵌入的资源，如图片、脚本、音频和视频等。
- href：用于定义超链接或引用外部资源，如 CSS 文件或导航链接。
图片
单独使用
使用<img src="图片地址" alt="图片描述">来定义图片，注意图片img没有结束对。alt会在图片加载失败时显示
<img src="/pic.png" alt="图片描述">与figure一起使用
<figure></figure>用于表示一段独立的内容，内包含<figcaption> 描述 </figcaption>元素。通常用在图像、插图、代码片段或引用
使用<figure> <img src="图片地址" alt="图片描述"> <figcaption> 图片标题 </figcaption> </figure>来定义图片
示例：
列表
无序列表
使用<ul> <li> </li> </ul>来定义无序列表
<ul> <li>序号1</li> <li>序号2</li></ul>等同于* 序号一示例：
- 序号1
- 序号2
有序列表
使用<ol> <li> </li> </ol>来定义有序列表
<ol> <li>序号1</li> <li>序号2</li></ol>等同于1. 序号一示例：
- 序号1
- 序号2
表单
使用<form action = "发往地址"></form>来定义表单，在其中可以设置：
<input type="输入种类" name="输入名称" id="id" placeholder="占位符" value="提前定好的值s">来定义输入框（若包含 required关键字，则输入框为必填项；若包含 checked关键字，则默认选中），input同样没有结束对
当type为radio时为单选框，type为checkbox时为复选框。多个单选框/复选框在使用相同name时视为一组，提交时通常提交name和value ，其中value可以通过设置固定值。通常使用<label><input type="radio">单选框</label>来绑定单选框和文字
<button type="点击要干什么">按钮</button>
选择框使用<select name="选择框名称"> <option value="选项值">选项文字</option> </select>来定义选择框，其中<option>可以设置 selected属性来默认选中某个选项。
<form action="https://somesite.com"> <fieldset> <legend>Is your cat an indoor or outdoor cat?</legend> <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label> <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label> </fieldset> label还可以使用for=id的形式进行绑定 <fieldset> <legend>What's your cat's personality?</legend> <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label> <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label> <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label> </fieldset> <input type="text" name="catphotourl" placeholder="cat photo URL" required> <select name="pets" id="pet-select"> <option value="">--Please choose an option--</option> <option value="dog">Dog</option> <option value="cat">Cat</option> </select> <button type="submit">Submit</button></form>示例：
页头
使用<head></head>来定义页头
其中可以：
使用<title></title>设置浏览器在页面的标题栏或选项卡中显示的内容；
<meta charset ="utf-8">设置解析这个html的编码格式，注意meta为单个无结束对
使用<style></style>+CSS来引入样式，关于CSS，请看这篇blog
等同于：<link href="CSS文件" rel="stylesheet"/>
<head> <title>标题</title> <meta charset="utf-8"></head>页脚
使用<footer> </footer>来定义页脚
其他
换行符
使用<br>来定义换行
<p>这个元素<br/>相当于\n</p>示例：
这个元素
相当于\n
强调符
使用<em> emphasize </em>或<strong> emphasize </strong>来定义强调符
<em>斜体强调符</em><strong>粗体强调符</strong>示例： 强调符 强调符