html5特性_html5的语义话标签

分类实验室日期2020-08-17 19:28:08访问105评论1

【注意】这些新特性都有兼容性的问题,基本是IE9+以上版本的浏览器才支持,如果不考兼容性问题,可以大量使用这些新特性

html5新增的语义话标签

<header> 头部标签
<nav> 导航栏标签
<article> 内容标签
<section> 定义文档某个区域
<aside> 侧边栏标签
<footer> 尾部标签

【注意】

这种语义化标准主要是针对搜索引擎的
这些新标签页面中可以使用多次
在IE9中,需要把这些元素转换为块级元素
更多移动端使用

HTML新增的多媒体标签

音频:<autio>

浏览器 MP3Wav Ogg
Internet ExplorerYESNONO
ChormeYESYESYES
FirefoxYESYESYES
SafariYESYESYES
OperaYESYESYES
属性描述
autoplayautoplay如果出现该属性,则音频就绪后马上播放
controlscontrols如果出现该属性,则向用户显示控件,比如播放按钮
looploop在音频结束时重新开始播放
srcurl要播放音频的URL

视频:<video>

浏览器  mp4webmogg
Internet ExplorerYES NONO
ChromeYESYESYES
FirefoxYESYESYES
SafariYESNONO
operaYESYESYES
<video src="文件地址" controls="controls"></video>
属性描述
autoplayautoplay视频就绪自动播放(谷歌浏览器需要添加muted来解决自动播放的问题)
controlscontrols向用户显示播放控件
widthpixels设置播放器宽度
heightpx设置播放器高度
looploop是否循环播放
preloadauto(预先加载视频)none(不预先加载视频)规定是否预先加载视频(如果有了auto play,就忽略该属性)
srcurl视频url地址
posterimgurl加载等待的画面图片
mutedmuted静音播放

新增表单

  属性值说明
type="email"用户输入的必须为Email类型
type=“url”限制用户必须输入为URL类型
type=“date”限制用户必须输入日期类型
type=“time”限制用户必须输入时间类型
type=“month”限制用户必须输入月份
type=“week”限制用户必须输入周
type=“number”限制用户输入数字
type=“tel”限制用户输入手机号
type=“search”搜索框
type=“color”生成一个颜色选择表单

新增的表单属性

  属性值  说明
requiredrequired表单拥有该属性表示其内容不能为空必填
placeholder提示文本表单的提示信息,存在默认值将不显示
autofocusautofocus自动聚焦属性,页面加载完成自动聚焦到指定表单
  auto complete  off\on当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出字段中填写的选项。默认已经打开,如autocomplete=“on”,关闭auto complete=“off”需要放在表单内,同时加上name属性,同时成功提交
multiple  multiple可以多选文件提交

扫描加入网页设计QQ群、建站如此简单

本文地址: https://www.usuuu.com/article/2TJ5rqmW