一、iframe 标签
http://www.w3school.com.cn/tags/tag_iframe.asp
HTML内联框架元素 <iframe> 表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。
<iframe id="inlineFrameExample" title="Inline Frame Example" width="300" height="200" src="https://www.openstreetmap.org/export/embed.html?bbox=-0.004017949104309083%2C51.47612752641776%2C0.00030577182769775396%2C51.478569861898606&layer=mapnik"></iframe>
常见属性：
1.height
以CSS像素格式HTML5，或像素格式HTML 4.01，或百分比格式指定frame的高度。
2.width
以CSS像素格式HTML5，或以像素格式HTML 4.01，或以百分比格式指定frame的宽度。
3.src
嵌套页面的URL地址。使用遵守同源策略的'about:blank'来嵌套空白页。
二、a 标签
属性见 MDN：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/a
HTML <a> 元素（或称锚元素）可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。使用方法如下：
<a href="https://www.baidu.com">跳转到百度首页</a>
常见属性：
1.download HTML5
此属性指示浏览器下载 URL 而不是导航到它，因此将提示用户将其保存为本地文件。
2.href
包含超链接指向的 URL 或 URL 片段。
URL 片段是哈希标记（#）前面的名称，哈希标记指定当前文档中的内部目标位置（HTML 元素的 ID）。URL 不限于基于 Web（HTTP）的文档，也可以使用浏览器支持的任何协议。例如，在大多数浏览器中正常工作的file:、ftp:和mailto：。
注意: 可以使用 href="#top" 或者 href="#" 链接返回到页面顶部。这种行为是 HTML5 的特性。
3.target
该属性指定在何处显示链接的资源。 取值为标签（tab），窗口（window），或框架（iframe）等浏览上下文的名称或其他关键词。以下关键字具有特殊的意义:
_self: 当前页面加载，即当前的响应到同一HTML 4 frame（或HTML5浏览上下文）。此值是默认的，如果没有指定属性的话。
_blank: 新窗口打开，即到一个新的未命名的HTML4窗口或HTML5浏览器上下文
_parent: 加载响应到当前框架的HTML4父框架或当前的HTML5浏览上下文的父浏览上下文。如果没有parent框架或者浏览上下文，此选项的行为方式与 _self 相同。
_top: IHTML4中：加载的响应成完整的，原来的窗口，取消所有其它frame。 HTML5中：加载响应进入顶层浏览上下文（即，浏览上下文，它是当前的一个的祖先，并且没有parent）。如果没有parent框架或者浏览上下文，此选项的行为方式相同_self
三、form 标签
属性见 MDN：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/form
HTML <form>元素 表示了文档中的一个区域，这个区域包含有交互控制元件，用来向web服务器提交信息。
常用属性：
1.action
一个处理这个form信息的程序所在的URL。这个值可以被<button> 或者<input> 元素中的formaction 属性重载（覆盖）。
2.method
浏览器使用这种HTTP 方式来提交 form. 可能的值有:
post: 指的是 HTTP POST 方法 ; 表单数据会包含在表单体内然后发送给服务器.
get: 指的是 HTTP GET 方法; 表单数据会附加在 action属性的URI中，并以 '?' 作为分隔符, 然后这样得到的 URI 再发送给服务器. 当这样做（数据暴露在URI里面）没什么副作用，或者表单仅包含ASCII字符时，再使用这种方法吧。
这个值可以被<button> 或者<input>元素中的formmethod属性重载（覆盖）。
3.name
这个form的名字。在HTML4中，这个用法不被推荐(作为替代，应该使用id). HTML5中，一个文档中的多个form当中，name必须唯一而不仅仅是一个空字符串。
4.novalidate HTML5
这个布尔类型的属性指示了，当提交时form是否没有被验证。 如果这个属性没有指定 (因此这个 form 是验证通过的)，这个默认设置可以被属于这个form的<button> 或者<input>元素中的 formnovalidate属性重载（覆盖）。
例子
<form action="">
<label for="GET-name">Name:</label>
<input id="GET-name" type="text" name="name">
<input type="submit" value="Save">
</form>
四、input / button
区别：是否为「空标签」，input是空元素，button不是
input 的属性见：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input
button 的属性见：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/button
HTML<input>元素用于为基于Web的表单创建交互式控件，以便接受来自用户的数据; 可以使用各种类型的输入数据和控件小部件，具体取决于设备和user agent。
HTML <button> 元素表示一个可点击的按钮，可以用在表单或文档其它需要使用简单标准按钮的地方。默认情况下，HTML按钮的显示样式接近于 user agent 所在的宿主系统平台（用户操作系统）的按钮， 但你可以使用CSS来改变按钮的样貌。
表单<input>类型
<input>的工作方式因其类型属性的值而有很大差异，不同的类型会在各自的参考页中进行介绍。如果未指定此属性，则采用的默认类型为 text
可用的值包括：text, checkbox，radio，number，password，email, hidden等
注意：<button>元素比 <input> 元素更容易使用样式。你可以在元素内添加HTML内容（像<em>、<strong> 甚至<img>），以及::after 和 ::before 伪元素来实现复杂的效果，而 <input> 只支持文本内容。
五、table 标签
属性见：https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/table
HTML的table 元素表示表格数据 — 即通过二维数据表表示的信息。
一个简单的table:
<table>
<tr>
<td>John</td>
<td>Doe</td>
</tr>
<tr>
<td>Jane</td>
<td>Doe</td>
</tr>
</table>
其它表格相关的HTML元素: <caption>, <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr>;
可能特别有用的关于设定表格元素样式的 CSS 属性：
width 控制表格的宽度；
border, border-style, border-color, border-width, border-collapse, border-spacing 控制单元格边框，规则和框架方面；
text-align 和vertical-align 定义文本和单元格内容的对齐方式。
网友评论