HTML5常用标签属性

事件元素

contentEditable=”true”
ondblclick=”document.designMode=’on’”

文档结构元素讲解

job老师有点帅

作者：job

还在帅呢

以上都是job老师的观点

    <hgroup>
        <h1>adad</h1>
        <h2>dad</h2>
    </hgroup>

    <figure>
        <figcaption>job老师很帅</figcaption>
        <img src="">
        <img src="">
    </figure>
</body>
</html>

语义相关元素讲解

<mark>job老师很帅</mark>
<time datetime="2016-9-11">2016-9-11</time>

特殊功能的元素

120

<meter value="0.8"></meter>
    min 定义最小值
    max 定义最大值
    value 定义度量的值
    low 定义度量的值位于那个点，界定为低的值
    high 定义度量的值位于那个点，界定为高的值
    optimum 定义什么值是最佳的

<progress max="100"  value="60" style="width:200px;border:1px solid #f60;color:#666;background:#abcdef;">11</progress>

spellcheck、文本域属性讲解

button
nnnn

<button type="submit" value="btn"> <img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/logo_white_fe6da1ec.png" alt=""></button>

表单元素讲解

input表单控件讲解

男
女

    <input type="checkbox" name="checkbox" value="1" checked=checked>篮球
    <input type="checkbox" name="checkbox" value="1">足球
    <input type="checkbox" name="checkbox" value="1">游泳<br/>

    <input type="file" name="file"><br/>
    <input type="hidden" name="hidden" value="job">123<br/>

    密码：<input type="password" name="password" value="" size="100"><br/>

    <input type="button" name="button" value="搜索">
    <input type="reset" name="reset" value="重填">
    <input type="submit" name="submit" value="提交">
</form>

label属性讲解
用户名：


密码：

男

女

select下拉列表讲解

<select size="3" id="sel" name="sel" multiple=multiple required=required></select>

<select name="year">
  <optgroup label="00后">
    <option value="2000">2001</option>
    <option value="2000">2000</option>
  </optgroup>
    <optgroup label="90后">
    <option value="1999">1999</option>
    <option value="1998">1998</option>
    <option value="1997">1997</option>
    <option value="1996">1996</option>
    <option value="1995">1995</option>
    <option value="1994">1994</option>
    <option value="1993">1993</option>
    <option value="1992">1992</option>
   </optgroup>
 </select>年
 <select name="month">月
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
 </select>月
 <select name="day">日
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="1">13</option>
    <option value="1">14</option>
    <option value="1">15</option>
    <option value="1">16</option>
    <option value="1">17</option>
    <option value="1">18</option>
    <option value="1">19</option>
    <option value="2">20</option>
    <option value="2">21</option>
    <option value="2">22</option>
    <option value="2">23</option>
    <option value="2">24</option>
    <option value="2">25</option>
    <option value="2">26</option>
    <option value="2">27</option>
    <option value="2">28</option>
    <option value="2">29</option>
    <option value="3">30</option>
    <option value="3">31</option>
 </select>日

autofocus属性讲解[焦点属性]

用户名：
密码：

</form>

html5form属性讲解

<form id="aForm" action="#" method="get">
    job:<input type="text" name="job">
    <input type="submit" value="搜索">
</form>

job描述:<textarea name="de" form="aForm"></textarea>

<form method="get" action="">
    用户名:<input type="text" name="name">
    密码:<input type="password" name="password">

    <input type="submit" value="修改" formaction="login.html">
    <input type="submit" value="注册" formaction="regist.html">
</form>

<form method="get" action="#">
    用户名:<input type="text" name="name">
    密码:<input type="password" name="password">

    <input type="submit" value="get提交" formmethod="get" formtarget="_blank">
    <input type="submit" value="post提交" formmethod="post" formtarget="_top">
</form>

新增html5input属性讲解

颜色:

日期:

时间:

日期、时间:

周:

月份:

e-mail:

电话:

url:

range:

search:

output属性讲解

0

100

</form>

<form oninput="y.value=co.value">
    <input type="color" name="co" id="co">
    <output name="y" for="co"></output>
    <input type="submit" value="tjiao ">

</form>

&lt;p&gt;job老师很帅&lt;/p&gt;<br/>

&quot;job&quot;<br/>

job&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;老师<br/>
&copy;2019.4.8

placeholder属性讲解

用户名：
密码：

</form>