<video>是HTML5中新增的重要标签，用它来引入视频这一生动活波的媒体形式，简单好用，因而这个标签在各种网页中非常常用。但它却并不那么完美。
问题来啦
我们来看一个再简单不过的页面（代码清单如下），主题内容只添加了一个video标签和一个用于做参照物的p标签：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no, address=no, email=no, time=no">
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0">
<title>Title</title>
</head>
<body>
<video src="http://www.w3school.com.cn/i/movie.mp4"></video>
<p>文本内容</p>
</body>
</html>可是，当用小米2S的自带浏览器（Anndroid版本：5.0.2LRX22G）浏览时，却发现视频并没有出现（如图1所示）：
图1
怎么破？
为什么呢？也许你想到的是，有点像是没有设置宽度和高度导致的。那么来给设置个样式给video加个宽度和高度吧：
video{
width: 320px;
height: 240px;
}再试一下，结果video所占区域是增大了，但是视频怎么还是不出现呢（如图2）？
图2
经过一番试验，原来是没有设置controls属性导致的。于是把<video src="http://www.w3school.com.cn/i/movie.mp4"></video>改成<video src="http://www.w3school.com.cn/i/movie.mp4" controls="controls"></video>，这下，video终于出现了（如图3）。
图3
结论
经过试验，在小米2S的自带浏览器（Anndroid版本：5.0.2LRX22G）中，video元素的宽高并不会根据其src所引用的文件宽高自动撑开，再加上未设置controls属性，因此也不会显示播放控件，所以最终的结果就是一小块空白。
接着，我们想在video上面遮盖一个层，来放置一些内容，这时又会遇到什么预想不到的问题呢，下回继续。
