HTML5新增标签和表单控件

版权声明:一个苦逼初学者的原创小博客。 https://blog.csdn.net/SenZendao/article/details/82533769

HTML5新增标签

新增语义标签
1、header 页面头部、页眉
2、nav 页面导航
3、article 一篇文章
4、section 文章中的章节
5、aside 侧边栏
6、footer 页面底部、页脚
音频视频
1、audio
2、video

下面代码是链接音频视频的方法,一般使用第三方链接

   <hr/>

    <audio src="./images/song.ogg" controls="controls"></audio>
    <video src="./images/movie.ogg" controls="controls"></video>
    <embed src='http://player.youku.com/player.php/sid/XMzgwODY0MTM1Ng==/v.swf' allowFullScreen='true' quality='high' width='480' height='400' align='middle' allowScriptAccess='always' type='application/x-shockwave-flash'></embed>
    <iframe height=498 width=510 src='http://player.youku.com/embed/XMzgwODY0MTM1Ng==' frameborder=0 'allowfullscreen'></iframe>



    <hr/>

HTML5新增表单控件

新增类型:网址 邮箱 日期 时间 星期 数量 范围 电话 颜色 搜索

<label>网址:</label><input type="url" name="" required><br><br> 
<label>邮箱:</label><input type="email" name="" required><br><br> 
<label>日期:</label><input type="date" name=""><br><br> 
<label>时间:</label><input type="time" name=""><br><br> 
<label>星期:</label><input type="week" name=""><br><br> 
<label>数量:</label><input type="number" name=""> <br><br>
<label>范围:</label><input type="range" name=""><br><br> 
<label>电话:</label><input type="tel" name=""><br><br> 
<label>颜色:</label><input type="color" name=""><br><br> 
<label>搜索:</label><input type="search" name=""><br><br>

新增常用表单控件属性:
1、placeholder 设置文本框默认提示文字
2、autofocus 自动获得焦点
3、autocomplete 联想关键词

猜你喜欢

转载自blog.csdn.net/SenZendao/article/details/82533769