zoukankan      html  css  js  c++  java
  • HTML 5 基础

    HTML 参考手册

    HTML 5 视频

    controls 属性供添加播放、暂停和音量控件。
    <video src="movie.ogg" width="320" height="240" controls="controls">
    Your browser does not support the video tag.
    </video>
    
    video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式:
    <video id="video" width="320" height="240" controls="controls">
      <source src="movie.ogg" type="video/ogg">
      <source src="movie.mp4" type="video/mp4">
    Your browser does not support the video tag.
    </video>
    
    
    属性	                值	            描述
    autoplay       autoplay	    如果出现该属性,则视频在就绪后马上播放。
    controls        controls	    如果出现该属性,则向用户显示控件,比如播放按钮。
    height	     pixels	            设置视频播放器的高度。
    loop              loop	            如果出现该属性,则当媒介文件完成播放后再次开始播放。
    preload	    preload	    如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
    src	            url	            要播放的视频的 URL。
    width	    pixels	            设置视频播放器的宽度。
    
    Video + DOM
    var myVideo=document.getElementById("video");
    myVideo.play(); 
    myVideo.pause(); 
    myVideo.width=320; 
    

    HTML 5 音频

    <audio src="song.ogg" controls="controls">
    Your browser does not support the audio tag.
    </audio>
    
    source 元素可以链接不同的音频文件。浏览器将使用第一个可识别的格式:
    <audio controls="controls">
      <source src="song.ogg" type="audio/ogg">
      <source src="song.mp3" type="audio/mpeg">
    Your browser does not support the audio tag.
    </audio>
    
    属性            	值	               描述
    autoplay	    autoplay	    如果出现该属性,则音频在就绪后马上播放。
    controls	    controls	    如果出现该属性,则向用户显示控件,比如播放按钮。
    loop	            loop	            如果出现该属性,则每当音频结束时重新开始播放。
    preload	    preload	    如果出现该属性,则音频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
    src	            url	            要播放的音频的 URL。
    

    HTML5 Input 类型

    E-mail: <input type="email" name="user_email" />    //在提交表单时,会自动验证 email 域的值。
    Homepage: <input type="url" name="user_url" />    //在提交表单时,会自动验证 url 域的值。
    Points: <input type="number" name="points" min="1" max="10" />
    Points: <input type="number" name="points" min="1" max="10" />    //range 类型用于应该包含一定范围内数字值的输入域。range 类型显示为滑动条。
    Date: <input type="date" name="user_date" />    //日期选择器
    HTML5 拥有多个可供选取日期和时间的新输入类型:
        date - 选取日、月、年
        month - 选取月、年
        week - 选取周和年
        time - 选取时间(小时和分钟)
        datetime - 选取时间、日、月、年(UTC 时间)
        datetime-local - 选取时间、日、月、年(本地时间)
    
  • 相关阅读:
    高级语言发展之回归人类思维——听老赵的Session有感
    走进单元测试(1):为什么难以广泛应用?
    梦话对象之三:三要素的差异与统一
    走进单元测试(2):必须要自动化
    缺乏自信怎么办?
    梦话对象之一:逃不开的生死问题
    走进单元测试(3):消灭HttpContext的依赖,兼谈单元测试的设计辅助性
    我也想对广大程序员说一些话
    梦话对象之二:事件之无限扩展
    《JavaScript高级程序设计》学习笔记——错误处理与调试
  • 原文地址:https://www.cnblogs.com/loveer/p/11345417.html
Copyright © 2011-2022 走看看