html新标签

新标签

常用新标签

header：定义文档的页眉 头部
nav：定义导航链接的部分
footer：定义文档或节的页脚 底部
article：定义文章。
section：定义文档中的节（section、区段）
aside：定义其所处内容之外的内容 侧边

<header> 定义页面的头部 页眉</header>
<nav>定义导航栏 </nav>
<footer>定义 页面底部 页脚</footer>
<article>定义文章</article>
<section>定义区域<ction>
<aside>定义其所处内容之外的内容 侧边</aside>

标签定义选项列表

<input type="text" value="输入数字" list="star"/> 
<datalist id="star">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</datalist>

fieldset 元素

<fieldset>
<legend>用户登录</legend> 
用户名: <input type="text"><br /><br />
密 码: <input type="password">
</fieldset>

input type属性值

        邮　箱:<input type="email"><br/>
        手机号:<input type="tel" oninput="value=value.replace(/[^\d]/g,'')"  /><br/>
        URL:<input  type="url" /><br/>
        数字:<input type="number"  />
        搜索框:<input type="search"  />
        自定滑动:<input type="range" />
        小时分钟:<input type="time" />
        年月日:<input type="date"  />
        时间:<input type="datetime-local" />
        月年:<input type="month"  />
        星期年:<input type="week"  />

常用新属性

placeholder

占位符 当用户输入的时候 里面的文字消失 删除所有文字，自动返回

用户名:<input type="text"  placeholder="请输入用户名" />

autofocus

规定当页面加载时input 元素应该自动获得焦点

用户名:<input type="text"  placeholder="请输入用户名" autofocus >

multiple

选择文件 未选择任何文件 多文件上传

文件上传:<input type="file" multiple  />

autocomplete

规定表单是否应该启用自动完成功能 有2个值，一个是on 一个是off on 代表记录已经输入的值
1.autocomplete 首先需要提交按钮
2.这个表单您必须给他名字

<form action="test.html" method="post" name="a">
	用户名:<input type="text"  placeholder="请输入用户名" autofocus   autocomplete="on"   /><br/>
	密　码:<input type="password" placeholder="请输入密码" autofocus  autocomplete="off" /><br/>
	年　龄:<input type="text"  accesskey="u"/>
	<input  type="submit" value="提交"/>
</form>

required

必填项 内容不能为空

 用户名:<input type="text"  placeholder="请输入用户名" autofocus   autocomplete="on"  required/>

accesskey

规定激活（使元素获得焦点）元素的快捷键 采用 alt + s的形式

 用户名:<input type="text"  placeholder="请输入用户名" autofocus   autocomplete="on"  required  accesskey="u"/>

多媒体标签

audio：播放音频

autoplay 自动播放
controls 是否显不默认播放控件
loop 循环播放 loop = 2 就是循环2次 loop 或者loop = “-1” 无限循环

   <!--  audio：播放音频   -->
    <audio controls autoplay>
        <source src="../mp3/新宝岛.mp3" />
    </audio>

video：播放视频

autoplay 自动播放
controls 是否显示默认播放控件
loop 循环播放
width 设置播放窗口宽度
height 设置播放窗口的高度

    <!-- video：播放视频  -->
    <video controls autoplay loop="-1">
        <source src="xxx.mp4"  />
    <ideo>