我的iPhone与ios版本9.3.2有一个显示错误，当我打开一个带有视频标签的html页面时，它有一个模糊的初始播放按钮，就像你在图片中看到的那样。有什么想法解决它吗？

Question

我的iPhone与ios版本9.3.2有一个显示错误，当我打开一个带有视频标签的html页面时，它有一个模糊的初始播放按钮，就像你在图片中看到的那样。有什么想法解决它吗？

@stock.each

.video_play_container {
    position: relative;
}
.video_play {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

Answer 1

这是因为您的网页不具有移动响应能力。在头标记中使用此元属性

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

尝试以下页面，

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

</head>

<body>

<div class="video_play_container">
  <span class="video_play" id="video_play"></span>
  <video width="100%" controls="controls" poster="http://7xoaon.com2.z0.glb.qiniucdn.com/s/p/product_v2/6ca/a9b/b7x/hsvb4000og0ck4ko4gkwwco8kg.jpg?imageMogr2/auto-orient/thumbnail/700x|watermark/3/image/aHR0cDovLzd4b2Fvbi5jb20yLnowLmdsYi5xaW5pdWNkbi5jb20vc2VlbG9nby5wbmc=/dissolve/100/gravity/SouthWest/dx/10/dy/10/text/5q-P5pel5LiAU2Vl/font/5b6u6L2v6ZuF6buR/fontsize/400/fill/I0VGRUZFRg==/dissolve/100/gravity/SouthWest/dx/50/dy/17">
    <source src="http://video.seecsee.com/2016/05/31/18/04e5a8230cf1f2605a66799033127c83.mp4">
  </video>
</div>

</body>
</html>

html视频控制初始播放按钮在ios9.3.2上显示模糊

我的iPhone与ios版本9.3.2有一个显示错误，当我打开一个带有视频标签的html页面时，它有一个模糊的初始播放按钮，就像你在图片中看到的那样。有什么想法解决它吗？

1 个答案: