HTML实用
注释
<!-- This is a comment -->
<!DOCTYPE>
<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
提示:请始终向 HTML 文档添加 <!DOCTYPE> 声明,这样浏览器才能获知文档类型。
HTML5只有一种:<!DOCTYPE html>,没有结束标签,大小写不敏感。
元素
HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。
大多数HTML元素可拥有属性。
属性
HTML标签可以拥有属性,属性提供了有关HTML元素的更多的信息。
属性总是以名称/值对的形式出现,比如:name=“value”。
属性总是在HTML元素的开始标签中规定,一般使用小写。
属性值应该始终被包含在引号内。双引号是常用的,单引号也可以,若属性值本身含有双引号,那必须用单引号。
大多数HTML元素包含如下属性:
class:规定元素的类名(classname)。
id:规定元素的唯一id。
style:规定元素的行内样式(inline style)。
Title:规定元素的额外信息(可在工具提示中显示)。
样式style
style属性用于改变HTML元素的样式。
有三种方式插入样式表:
外部样式表:<head><link rel=”stylesheet” type=”text/css” href=”mystyle.css”></head>
内部样式表:
<head><style type=”text/css”> body {background-color: red} p {margin-left: 20px} </style></head>
内联样式: 当特殊的样式需要应用到个别元素时,可以使用内联样式。在相关的标签中直接使用样式属性。样式属性可以包含任何 CSS 属性。
<p style=”color: red; margin-left: 20px”> This is a paragraph</p>
链接
通过<a>标签在HTML中创建链接,有两种使用<a>标签的方式:
通过href属性,创建指向另一个文档的链接。
通过name属性,创建文档内的书签,即锚。
使用target属性定义被链接的文档在何处显示,如果target=_blank,链接会在新窗口打开。
首先,我们在 HTML 文档中对锚进行命名(创建一个书签):<a name="tips">基本的注意事项 - 有用的提示</a>
然后,在同一个文档中创建指向该锚的链接:<a href="#tips">有用的提示</a>
将 # 符号和锚名称添加到 URL 的末端,就可以直接链接到 tips 这个命名锚了。
跳转
<head><meta http-equiv="refresh" content="0; url=%s"></head>
表格
表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。表格的表头使用 <th> 标签进行定义。
<table border="1"> <tr> <th>Heading</th><th>Another Heading</th> </tr> <tr> <td>row 1, cell 1</td><td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td><td>row 2, cell 2</td> </tr> </table>
列表
HTML支持有序(ol),无序(ul)和定义列表(dl)。
自定义列表不仅仅是一列项目,而是项目及其注释的组合。自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的描述以 <dd> 开始。
<dl> <dt>Coffee</dt> <dd>Black hot drink</dd> <dt>Milk</dt> <dd>White cold drink</dd> </dl>
块
可以通过<div>和<span>将HTML元素组合起来。
<div>
<div> 定义文档中的节或区域(块级),用于组合其他 HTML 元素的容器。前后显示折行。
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。
<span>
<span> 标签定义文档中行内的小块或区域,用作文本的容器,组合行内元素。
<p class="tip"><span>提示:</span>... ... ...</p>
类
对HTML进行分类(设置类),能够为元素的类定义CSS样式。为相同的类设置相同的样式,或者为不同的类设置不同的样式。
框架
框架结构标签<frameset>定义如何将窗口分割为框架,每个frameset定义一系列行或列,rows/columns的值规定了每行或每列占据屏幕的面积。
框架标签<frame>定义了放置在每个框架中的HTML文档。
<frameset cols="25%,75%"> <frame src="frame_a.htm"> <frame src="frame_b.htm"> </frameset>
Iframe用于在网页内显示网页。
<iframe src="demo_iframe.htm" name="iframe_a" width="200" height="200"></iframe>
<p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>
事件
参考:https://www.w3school.com.cn/tags/html_ref_eventattributes.asp
window事件、form事件、keyboard事件、mouse事件、media事件。
参考:
1. https://www.w3school.com.cn/html/index.asp
2. https://www.w3school.com.cn/tags/tag_doctype.asp