HTML引用
-
<q>元素定义短的引用，浏览器通常会为<q>元素包围引号。 -
<blockquote>元素定义被引用的节，浏览器通常会对<blockquote>元素进行缩进处理。 -
<abbr>元素定义缩写或首字母缩略语。对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。 -
<dfn>元素定义项目或缩写的定义。如果希望简而化之，请设置<dfn>元素的title属性或使用<abbr>代替。 -
<address>元素定义文档或文章的联系信息（作者/拥有者）。
此元素通常以斜体显示。大多数浏览器会在此元素前后添加折行。 -
<cite>元素定义著作的标题。浏览器通常会以斜体显示 <cite> 元素。 -
<bdo>元素定义双流向覆盖（bi-directional override）。
<bdo> 元素定义文本方向，用于覆盖当前文本方向：
<bdo dir="rtl">My Bolg</bdo>
gloB yM
HTML链接
HTML使用标签<a>来设置超文本链接，使用超级链接与网络上的另一个文档相连。
默认情况下，链接将以以下形式出现在浏览器中：
- 一个未访问过的链接显示为蓝色字体并带有下划线。
- 访问过的链接显示为紫色并带有下划线。
- 点击链接时，链接显示为红色并带有下划线。
- 当把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。
有两种使用 <a> 标签的方式：
- 通过使用 href 属性（规定链接的目标）- 创建指向另一个文档的链接。
- 通过使用 name 属性（规定锚（anchor）的名称）- 创建文档内的书签。
基本的注意事项 - 有用的提示
- 请始终将正斜杠添加到子文件夹。假如这样书写链接：
href="http://www.runoob.com/html"，就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址，然后创建一个新的请求，就像这样：href="http://www.runoob.com/html/"。- 也可以使用 id 属性来替代 name 属性，命名锚同样有效。
命名锚经常用于在大型文档开始位置上创建目录。可以为每个章节赋予一个命名锚，然后把链接到这些锚的链接放到文档的上部。- 假如浏览器找不到已定义的命名锚，那么就会定位到文档的顶端。不会有错误发生。
使用 Target 属性，你可以定义被链接的文档在何处显示。
_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self
这个目标的值对所有没有指定目标的 <a> 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题 <base> 标签中的 target 属性一起使用。
_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中，那么它与目标_self 等效。
_top
这个目标使得文档载入包含这个超链接的窗口，用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
提示：这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略，因此，不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。
使用a链接发送邮件：
<p>
这是一个电子邮件链接：
<a href="mailto:someone@example.com?cc=someoneelse@example.com&bcc=andsomeoneelse@example.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!" target="_top">发送邮件!</a>
</p>
<p>
<b>注意:</b> 单词直接空格使用 %20 代替，以确保浏览器可以正常显示文本。
</p>
HTML头部
HTML <head>元素
-
<head>元素是所有头部元素的容器。 - 在
<head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta元信息。 - 以下标签都可以添加到 head 部分：
<title>、<base>、<link>、<meta>、<script>以及<style>。
HTML<title> 元素
-
<title>标签定义文档的标题。 -
<title>元素在所有 HTML/XHTML 文档中都是必需的。 -
<title>元素能够：
1.定义浏览器工具栏中的标题
2.提供页面被添加到收藏夹时显示的标题
3.显示在搜索引擎结果中的页面标题
HTML<base> 元素
-
<base>标签为页面上的所有链接规定默认地址或默认目标（target）：
<head>
<base href="http://www.xxxx.com/images/" target="_blank">
</head>
HTML<link> 元素
-
<link>标签定义了文档与外部资源之间的关系。 -
<link>标签通常用于链接到样式表：
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
HTML<style> 元素
-
<style>标签用于为 HTML 文档定义样式信息。 - 可以在 style 元素内规定 HTML 元素在浏览器中呈现的样式：
<head>
<style type="text/css">
body {background-color:red}
p {color:blue}
</style>
</head>
HTML <meta>元素
- 元数据（metadata）是关于数据的信息。
-
<meta>标签提供关于 HTML 文档的元数据，元数据不会显示在页面上，但会被浏览器解析。 - 元素通常用于指定网页的描述，关键词，文档的作者、最后修改时间和其他元数据。
-
<meta>标签始终位于 head 元素中。 - 元数据可用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 web 服务。
<meta> 标签- 使用实例
一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引您的页面，name 和 content 属性的作用是描述页面的内容。
为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:
<meta name="description" content="免费 Web & 编程 教程">
定义网页作者:
<meta name="author" content="Runoob">
每30秒中刷新当前页面:
<meta http-equiv="refresh" content="30">
HTML<script> 元素
-
<script>标签用于定义客户端脚本，比如 JavaScript。
HTML 图像
图像标签（<img />）和源属性（Src）
<img /> 是空标签，意思是说，它只包含属性，并且没有闭合标签。
定义图像的语法是：
- 要在页面上显示图像，需要使用源属性src （"source"）来指明图像的 URL 地址。
- 加载页面时，如果页面的图像路径没有被正确设置，浏览器则无法加载图片，图像标签就会显示一个破碎的图片。
替换文本属性（Alt）
alt 属性用来为图像定义一串预备的可替换的文本，替换文本属性的值是用户自定义的。
- 在浏览器无法载入图像时，替换文本属性告诉读者他们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。
- 为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。
- 指定图像的高度和宽度的一个很好的习惯。如果图像指定了高度宽度，页面加载时就会保留指定的尺寸。如果没有指定图片的大小，加载页面时有可能会破坏HTML页面的整体布局。
创建图片映射笔记：
<img>定义图像，<map>定义图像地图，<area>定义图像地图中的可点击区域
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
该段代码中的shape指的是点击区域的形状，coords指的应该是链接区域在图片中的坐标（像素为单位）。
1、距形：(左上角顶点坐标为(x1,y1)，右下角顶点坐标为(x2,y2))
<area shape="rect" coords="x1,y1,x2,y2" href=url>
2、圆形：(圆心坐标为(X1,y1)，半径为r)
<area shape="circle" coords="x1,y1,r" href=url>
3、多边形：(各顶点坐标依次为(x1,y1)、(x2,y2)、(x3,y3) ......)
<area shape="poly" coords="x1,y1,x2,y2 ......" href=url>
HTML表格
表格由<table> 标签来定义。每个表格均有若干行（由 <tr>标签定义），每行被分割为若干单元格（由 <td>标签定义）。
- 字母
td指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 - 如果不定义边框属性，表格默认将不显示边框。有时这很有用，但是大多数时候，我们使用
border属性来显示边框。 - 表格的标题使用
<caption>标签进行定义，位于<table>开始标签与<tr>或<thead>标签之间。 - 表格的表头使用
<th>标签进行定义，大多数浏览器会把表头显示为粗体居中的文本。 - 在一些浏览器中，没有内容的表格单元显示得不太好。如果某个单元格是空的（没有内容），浏览器可能无法显示出这个单元格的边框。为了避免这种情况，在空单元格中添加一个
空格占位符，就可以将边框显示出来。 -
横向跨列属性：
colspan纵向跨行属性：rowspan如果是又横向又纵向的合并，这个时候同时标示colspan和rowspan（空格隔开）。合并后的单元格归属原则都是左上原则，即下归上，右归左，越往左上角越优先。 - 单元格边距(
Cell padding)， 用来创建单元格内容与其边框之间的空白。 - 单元格边距(
Cell spacing)， 用来增加单元格之间的距离。
HTML列表
HTML 支持有序、无序和自定义列表，三种列表项内部都可以使用段落、换行符、图片、链接以及其他列表等等。
有序列表
- 有序列表是一列项目，列表项目默认使用数字进行标记。
- 有序列表始于
<ol>标签。每个列表项始于<li>标签。 - 有序列表可根据
<ol>的type属性的值为A、 a、 I、 i 来分别使用大写字母，小写字母，大写罗马字母，小写罗马字母来标记列表项目。
无序列表
- 无序列表也是一个项目的列表，默认使用粗体圆点（典型的小黑圆圈）进行标记。
- 无序列表始于
<ul>标签。每个列表项始于<li>标签。 - 无序列表可根据
<ul>的type属性的值为disc、 circle、 square 来分别使用实心小黑圆圈（默认），空心小黑圆圈，实心小黑方块来标记列表项目。
定义列表
- 自定义列表不仅仅是一列项目，而是项目及其注释的组合。
- 自定义列表以
<dl>标签开始，每个自定义列表项以<dt>开始，每个自定义列表项的定义以<dd>开始。
<dl> //自定义列表
<dt>Coffee</dt> //列表项
<dd>- black hot drink</dd> //列表项的注释
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
网友评论