11_HTML5基础_input range到不了0-CSDN博客

本文链接：https://blog.csdn.net/weixin_58764638/article/details/125860071

一、语义化标签

HTML5中新增的语义化标签

section表示内容块和div的作用一样
6个常用的语义化标签默认都是块级元素

二、音视频标签

音视频标签的使用
一:音频标签audio
二:视频标签video
三:音视频标签共有的属性

src路径地址
controls控件(显示)
autoplay自动播放
loop 循环
muted 静音

四:不同属性的使用(视频标签独有的属性)

poster视频未加载首屏图片

五:不同的浏览器对于音视频的后缀名要求不一样

source引入资源

三、HTML5中表单中type的属性值使用

HTML5中表单中type的属性值使用

智能表单需要在form表单框中使用
需要有提交按钮
智能表单只能检测当前输入的内容是否符合格式,为空的时候是可以提交的

邮件:

地址:

数字:

滑块:

四、HTML5中新增的时间表单

<form>
    <p> 日: <input type="date"> </p>
    <p> 月: <input type="month"> </p>
    <p> 周: <input type="week"> </p>
    <p> 时间: <input type="time"> </p>
    <p> 本地时间: <input type="datetime-local"> </p>
    <p> 标准时间: <input type="datetime"> </p>
    <!-- 过时了 可以用上面的本地时间 -->
</form>

五、表单新增的属性

input{
        font-size: 12px;
    }
    input::-webkit-input-placeholder{
        color: red;
    }
</style>

<form novalidate>
    <p> 姓名: <input type="text" required autofocus  maxlength="11"> </p>
    <p> 密码: <input type="password" placeholder="请输入密码" autofocus> </p>
    <p> <input type="submit"> </p>
</form>

六、模拟下拉菜单

<form>
    <input type="text" list="history" name="history" autocomplete="off">
    <datalist id="history">
        <option value="http://www.baidu.com">百度</option>
        <option value="http://www.tencent.com">腾讯</option>
        <option value="http://www.wangease.com">网易</option>
        <option value="http://www.uc.com">UC</option>
        <option value="http://www.kuaibo.com">快播</option>
    </datalist>
    <input type="submit"> 
</form>