HTML
简介
- <!DOCTYPE html> 声明为 HTML5 文档
- <html> 元素是 HTML 页面的根元素
- <head> 元素包含了文档的元（meta）数据，如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
- <title> 元素描述了文档的标题
- <body> 元素包含了可见的页面内容
- <h1> 元素定义一个大标题
- <p> 元素定义一个段落
元素
语法
- HTML 元素以开始标签起始，以结束标签终止
- 元素的内容是开始标签与结束标签之间的内容
- 某些 HTML 元素具有空内容（empty content）
- 空元素在开始标签中进行关闭（以开始标签的结束而结束）
- 大多数 HTML 元素可拥有属性
实例
<p> 元素:
<p>这是第一个段落。</p>
这个 <p> 元素定义了 HTML 文档中的一个段落。
这个元素拥有一个开始标签 <p> 以及一个结束标签 </p>.
元素内容是: 这是第一个段落。
<body> 元素:
<body>
<p>这是第一个段落。</p>
</body>
<body> 元素定义了 HTML 文档的主体。
这个元素拥有一个开始标签 <body> 以及一个结束标签 </body>。
元素内容是另一个 HTML 元素（p 元素）。
<html> 元素：
<html>
<body>
<p>这是第一个段落。</p>
</body>
</html>
<html> 元素定义了整个 HTML 文档。
这个元素拥有一个开始标签 <html> ，以及一个结束标签 </html>.
元素内容是另一个 HTML 元素（body 元素）。
- 一些标签的使用，切记所有标签都需要闭合，不管是单体标签还是成对标签。（尽管目前浏览器是识别有些标签不闭合的情况，但是取的最好的保证兼容性，使用闭合）
- <br> 就是没有关闭标签的空元素（<br> 标签定义换行），在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法。
- 标签写法要用小写字母（有些版本对大小写可认为相同，而xhtml中强制使用小写）
属性
- HTML 元素可以设置属性
- 属性可以在元素中添加附加信息
- 属性一般描述于开始标签
- 属性总是以名称/值对的形式出现，比如：name="value"。
实例
HTML 链接由 <a> 标签定义。链接的地址在 href 属性中指定：
<a href="http://www.runoob.com">这是一个链接</a>引用属性值
属性值应该始终被包括在引号内。
双引号是最常用的，不过使用单引号也没有问题
提示: 在某些个别的情况下，比如属性值本身就含有双引号，那么必须使用单引号，例如：
name='John "ShotGun" Nelson'
- 属性和属性值，尽量小写。
- class 属性可以多用 class=" " （引号里面可以填入多个class属性）
- id 属性只能单独设置 id=" "（只能填写一个，多个无效）
标题
标题（Heading）是通过 <h1> - <h6> 标签进行定义的。
<h1> 定义最大的标题。 <h6> 定义最小的标题。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TITLE</title>
</head>
<body>
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
</body>
</html>
- 确保将 HTML 标题 标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。
- 搜索引擎使用标题为您的网页的结构和内容编制索引。
- 因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。
- 应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。
标题大小与字体大小的关系
1到6号标题与1到6号字体逆序对应，比如1号字体对应6号标题，2号字体对应5号标题。
<h1>这是1号标题</h1>
<font size="6">这是6号字体文本</font>
<h2>这是2号标题</h2>
<font size="5">这是5号字体文本</font>
<h3>这是3号标题</h3>
<font size="4">这是4号字体文本</font>
<h4>这是4号标题</h4>
<font size="3">这是3号字体文本</font>
<h5>这是5号标题</h5>
<font size="2">这是2号字体文本</font>
<h6>这是6号标题</h6>
<font size="1">这是1号字体文本</font>
水平线
<hr> 标签在 HTML 页面中创建水平线。
hr 元素可用于分隔内容。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TITLE</title>
</head>
<body>
<p>hr 标签定义水平线：</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
<hr />
<p>这是段落。</p>
</body>
</html>
注释
开始括号之后（左边的括号）需要紧跟一个叹号 ! (英文标点符号)，结束括号之前（右边的括号）不需要
<!-- 这是一个注释 -->段落
<p>这是一个段落 </p>
<p>这是另一个段落</p>折行
<p>这个<br/>段落<br/>演示了分行的效果</p>
当显示页面时，浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是，HTML 代码中的所有连续的空行（换行）也被显示为一个空格。
文本格式化
链接
<a>元素具有以下属性：
href：指定链接目标的URL，这是链接的最重要属性。可以是另一个网页的URL、文件的URL或其他资源的URL。target（可选）：指定链接如何在浏览器中打开。常见的值包括_blank（在新标签或窗口中打开链接）和_self（在当前标签或窗口中打开链接）。title（可选）：提供链接的额外信息，通常在鼠标悬停在链接上时显示为工具提示。rel（可选）：指定与链接目标的关系，如 nofollow、noopener 等。
文本链接
<a href="https://www.example.com">访问示例网站</a>
图像链接
<a> 元素包围着 <img> 元素
<a href="https://www.example.com"> <img decoding="async" src="example.jpg" alt="示例图片"> </a>
下载链接
使用 download 属性
<a href="document.pdf" download>下载文档</a>
target 属性
在新窗口打开文档:
<a href="https://www.example.com/" target="_blank" rel="noopener noreferrer">访问网站!</a>
- target="_blank":在新窗口中浏览新的页面。
- target="_self":在同一个窗口打开新的页面。
- target="_parent":在父窗口中打开新的页面。（页面中使用框架才有用）
- target="_top" :以整个浏览器作为窗口显示新页面。（突破了页面框架的限制）
id 属性
id 属性可用于创建一个 HTML 文档书签。
书签不会以任何特殊方式显示，即在 HTML 页面中是不显示的，所以对于读者来说是隐藏的。
在HTML文档中插入ID:
<a id="tips">有用的提示部分</a>在HTML文档中创建一个链接到"有用的提示部分(id="tips"）"：
<a href="#tips">访问有用的提示部分</a>或者，从另一个页面创建一个链接到"有用的提示部分(id="tips"）"：
<a href="https://www.example.com/html/html-links.html#tips"> 访问有用的提示部分</a>
注意事项
请始终将正斜杠添加到子文件夹。
假如这样书写链接：href="https://www.runoob.com/html"，就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址，然后创建一个新的请求，就像这样：href="https://www.runoob.com/html/"。
发送邮件内容
在进行邮件内容发送时，需要使用关键字：mailto
<a href="mailto:zhangrr601@163.com?subject=这是邮件的主题&body=这是邮件的内容" rel="nofollow">发送邮件</a>这样会调启系统默认的邮件程序发送给 zhangrr601@163.com，并且收件人那里已经填上了我邮箱的地址。
关于创建电子邮件链接时如何进行抄送，密送.
在进行抄送时，需要使用关键字：cc
在进行密送时，需要使用关键字：bcc
<a href="mailto:zhangrr601@163.com?cc=someone@163.com&bcc=somebody@163.com" rel="nofollow">发送邮件</a>
参数 描述 mailto:name@email.com 邮件接收地址 cc=name@email.com 抄送地址 bcc=name@email.com 密件抄送地址 subject=subject text 邮件主题 body=body text 邮件内容 ? 第一个参数分隔符 & 其他参数分隔符 注：多个邮件地址用 ; 隔开，空格用 %20 代替。
抄送：
英文名称：Carbon Copy，又简称为 CC。在网络术语中，抄送就是将邮件同时发送给收信人以外的人，用户所写的邮件抄送一份给别人，对方可以看见该用户的 E-mail。同收件人地址栏一样，不可以超过 1024 个字符。一般来说，使用"抄送"服务时，多人抄送的电子邮件地址使用 ; 分隔。
密件抄送：
英文名称：Blind Carbon Copy ，又称“盲抄送”，和抄送的唯一区别就是它能够让各个收件人无法查看到这封邮件同时还发送给了哪些人。密件抄送是个很实用的功能，假如一次向成百上千位收件人发送邮件，最好采用密件抄送方式，这样一来可以保护各个收件人的地址不被其他人轻易获得，二来可以使收件人节省下收取大量抄送的 E-mail 地址的时间。
实例
图片链接
如何使用图片链接。在当前页面链接到指定位置
如何使用书签跳出框架
本例演示如何跳出框架，假如你的页面被固定在框架之内。创建电子邮件链接
本例演示如何链接到一个邮件。（本例在安装邮件客户端程序后才能工作。）创建电子邮件链接 2
本例演示更加复杂的邮件链接。
扫一扫
2948
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
