标签学习

1、格式

<bdi></bdi>:允许您设置一段文本,使其脱离其父元素的文本方向设置。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

</body>
</html>
bdi标签

html标签结果展示截图:     

<meter></meter>:定义度量衡。仅用于已知最大和最小值的度量。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

<p><meter value="2" min="0" max=10>2 out of 10</meter> 20%</p>
<p><meter value="0.5">50%</meter> 50%</p>

</body>
</html>
meter标签

html标签结果展示截图:

<progress></progress>:定义运行中的任务进度(进程)。注释:IE 9 或者更早版本的 IE 浏览器不支持 <progress> 标签。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

<p><meter value="2" min="0" max=10>2 out of 10</meter> 20%</p>
<p><meter value="0.5">50%</meter> 50%</p>

<p>下载进度30% <progress value=30 max="100"></progress></p>

</body>
</html>
progress标签

html标签结果展示截图:

<q></q>:定义短的引用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

<p><meter value="2" min="0" max=10>2 out of 10</meter> 20%</p>
<p><meter value="0.5">50%</meter> 50%</p>

<p>下载进度30% <progress value=30 max="100"></progress></p>

<p>He said:<q>do what you want.</q></p>

</body>
</html>
q标签

html标签结果展示截图:

<ruby></ruby>:定义 ruby 注释(中文注音或字符)。<rt></rt>:定义字符(中文注音或字符)的解释或发音。<rp></rp>:定义不支持 ruby 元素的浏览器所显示的内容。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

<p><meter value="2" min="0" max=10>2 out of 10</meter> 20%</p>
<p><meter value="0.5">50%</meter> 50%</p>

<p>下载进度30% <progress value=30 max="100"></progress></p>

<p>He said:<q>do what you want.</q></p>

<ruby><rp>(</rp><rt>Han</rt><rp>)</rp><rp>(</rp><rt>zi</rt><rp>)</rp>
</ruby>

</body>
</html>
ruby、rp、rt标签

 html标签结果展示截图:

<u></u>:underline定义下划线文本。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<p id="one" style="color:red;font-size:10pt;">Let's
<bdi id="one_sub" style="color:blue;font-size:20pt"> begin</bdi>
</p>

<p><meter value="2" min="0" max=10>2 out of 10</meter> 20%</p>
<p><meter value="0.5">50%</meter> 50%</p>

<p>下载进度30% <progress value=30 max="100"></progress></p>

<p>He said:<q>do what you want.</q></p>

<ruby><rp>(</rp><rt>Han</rt><rp>)</rp><rp>(</rp><rt>zi</rt><rp>)</rp>
</ruby>

<p>Here we <u>go</u></p>

</body>
</html>
u标签

 html标签结果展示截图:

2、表单

<form></form>:定义一个 HTML 表单,用于用户输入。

<form> 元素包含一个或多个如下的表单元素:
    <input>、<textarea>、<button>、<select>、<option>、<optgroup>、<fieldset>、<label>

<form>属性:

action                  URL                        规定当提交表单时向何处发送表单数据。
autocompleteNew        on / off                    规定是否启用表单的自动完成功能。
method                get / post                    规定用于发送表单数据的 HTTP 方法。
name                  text                                规定表单的名称。
novalidateNew        novalidate                    如果使用该属性,则提交表单时不进行验证。
target        _blank / _self / _parent / _top            规定在何处打开 action URL
View Code

 <input>:定义一个输入控件。

<textarea></textarea>:定义多行的文本输入控件。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Learn to use it</title>

</head>
<body>

<form>
<textarea rows="5" cols="30">
It is never too old to learn.
</textarea>
</form>

</body>
</html>
textarea标签

 html标签结果展示截图:

<button></button>:定义按钮。

<button>属性

name                    name                                        规定按钮的名称。
type               button/reset/submit                                 规定按钮的类型。
value                       text                                规定按钮的初始值。可由脚本进行修改。
formmethod               get/post                    规定用于发送表单数据的 HTTP 方法。覆盖 form 元素的 method 属性。该属性与 type="submit" 配合使用。
formnovalidate        formnovalidate            如果使用该属性,则提交表单时不进行验证。覆盖 form 元素的 novalidate 属性。该属性与 type="submit" 配合使用。
formtarget        _blank / _self / _parent / _top    / framename                规定在何处打开 action URL。覆盖 form 元素的 target 属性。该属性与 type="submit" 配合使用。
formactionNew            URL                        规定当提交表单时向何处发送表单数据。覆盖 form 元素的 action 属性。该属性与 type="submit" 配合使用。
button属性
原文地址:https://www.cnblogs.com/windyrainy/p/10722210.html