HTML5新特性

HTML5新特性

    • HTML5优势
    • 新增语义化标签
    • 多媒体音频标签
    • 多媒体视频标签
    • 新增表单标签

文章内容输出来源:拉勾教育大前端就业急训营

HTML5优势

  1. 提高可用性和用户体验
  2. 更好的语义化标签
  3. 更多的多媒体元素
  4. 替代flash、SilverLight
  5. 对于搜索引擎优化SEO友好
  6. 多应用于移动应用程序和游戏
  7. 可移植性好

新增语义化标签

标签 名称
头部标签
导航标签
主体部分标签
独立的内容标签
区域标签,与div类似,但section语义化
侧边栏标签
脚部标签

多媒体音频标签

属性名 属性值 作用
src rul 音频文件的路径
controls controls 显示控件,即播放条
autoplay autoplay 自动播放(在Chrome中无效)
loop loop 循环播放
preload preload 自动预加载,若设置了autoplay,那么preload无效

因为

	

多媒体视频标签

属性名 属性值 作用
src rul 视频文件的路径
controls controls 显示控件,即播放条
autoplay autoplay 自动播放(Chrome在muted的情况下支持自动播放)
loop loop 循环播放
preload auto/none 自动预加载,若设置了autoplay,那么preload无效
muted muted 静音播放
poster Imgurl 视频加载时显示的图片
width px值 视频窗口的宽度
height px值 视频窗口的高度

因为

	

新增表单标签

  • 新增的 type属性值
    type属性值 作用
    email 输入邮箱类型
    url 输入url类型
    date 输入年月日
    time 输入时间类型
    month 输入年月
    week 输入年周
    number 输入数字类型(可设最大值max="",最小值min="")
    range 滑动条
    tel 手机号码
    search 搜索框
    color 颜色选择表单
  • 标签
    • 规定了元素可能的选项列表
    • 语法规则:需要给datalist标签添加id属性,给关联的input标签添加属性值为datalist的id属性值的list属性
        
        
            
            
            
        
    
  • 新增的表单控件属性
    属性名 属性值 作用
    required required 将表单控件设置为必填项
    placeholder 提示文本 表单的提示信息,存在value时,placeholder的文本不显示
    autofocus autofocus 自动聚焦
    autocomplete off/on 控件需要有name属性且之前提交过数据,autocomplete才能起作用
    multiple multiple 可多选文件提交

你可能感兴趣的:(学习笔记,html)