html5 <video>可以改变默认样式吗

html-css022

html5 <video>可以改变默认样式吗,第1张

播放器可以弄自定义样式的

html:

<div style="text-align:center">

   <div>

       <button onclick="playPause()">播放/暂停</button> 

       <button onclick="makeBig()">大</button>

       <button onclick="makeNormal()">中</button>

       <button onclick="makeSmall()">小</button>

   </div>

   <video id="video1" width="420" style="margin-top:15px">

       <source src="http://www.w3school.com.cn/i/movie.mp4" type="video/mp4" />

       <source src="http://www.w3school.com.cn/i/movie.ogg" type="video/ogg" />

       Your browser does not support HTML5 video.

</video>

</div> 

js:

var myVideo=document.getElementById("video1")

function playPause(){ 

   if (myVideo.paused) 

       myVideo.play() 

   else 

       myVideo.pause() 

function makeBig(){ 

   myVideo.width=560 

function makeSmall(){ 

   myVideo.width=320 

function makeNormal(){ 

   myVideo.width=420 

}

布局样式在css里改可以了

参考http://w3school.com.cn/html5/html_5_video_dom.asp

先给你一段代码

这里我写的代码,在样式里可以将video和class="v-txt"给绝对定位,最外面的id="video"给相对定位,然后自己看你要放的位置就可以了

HTML 5 <video>标签

定义和用法

<video>标签定义视频,比如电影片段或其他视频流。

提示和注释

提示:可以在开始标签和结束标签之间放置文本内容,这样老的浏览器就可以显示出不支持该标签的信息。

属性

实例

<!-- 一段简单的 HTML5 视频:-->

<video src="movie.ogg" controls="controls">您的浏览器不支持 video 标签。</video>