奇怪的边框在视频标签上留下黑色

Question

民间，

奇怪的边框在HTML中的<video>上留下1px（黑色）：

我不使用任何CSS border或outline。如何删除边框左黑？

HTML：

<video id="bgvid" playsinline="" autoplay="" muted="" loop="">
  <source src="https://www.glasseson.lt/wp-content/themes/glasseson/videos/cover.mp4" type="video/mp4">
</video>

网址：https://www.glasseson.lt/en/

Answer 1

The line is in the video itself.

另外，请不要让26秒的视频大小为70MB。这太荒谬了，特别是封面视频。比特率对我的互联网连接来说太高了（可以播放合理压缩的1440p视频就好了--YouTube，Vimeo等），它会带动你的带宽通过屋顶。目标最多为13MB（500KB /秒），尽管不太可能是个好主意。它是一个相当简单的动画，因此您可以在HTML5 / JavaScript中重新创建它（尽管噪音可能会造成问题）。

请注意，在移动设备上，无论浏览器或操作系统如何，视频都不会自动播放，因此您可能需要寻找替代图形，因为它目前只是一个空白区域。同样值得注意的是，网站不应该自动播放声音，因为它只是不需要的，通常被认为是某种罪。

最后一件事 - 如果您在导出视频时没有选择一个选项，可以通过将moov原子放在文件的开头来为网络优化它，那么就这样做吧！如果我没记错的话，这会消除一些HTTP请求。看起来你还没有做到这一点，但我并非100％肯定。如果您在软件中找不到这样的选项，则可以使用ffmpeg执行此操作，而无需重新编码视频。如果您愿意，可以自己查找如何安装它 - 这里是命令（如果使用Windows则添加.exe）：

class Child extends Component {

  componentDidMount() { // this works fine and render only one time, this what I really wanna do but I don't like to use setTimeOut
    setTimeout(() => {
      console.log(this.props.check); 
    }, 2000)
  }
  componentWillReceiveProps(nextProps){ // this works but when any action happening this will re-render 
    if (nextProps.check !== this.props.check){
      console.log(this.props.check)
    }
  }
  render() {
    return (
      <div>
        <span>Child Component</span>
      </div>
    )
  }
}

export default Child;

希望这个答案有所帮助，如果我让你觉得有点愚蠢，它一直都是视频的一部分，我很抱歉。

如果由于某种原因你无法修复视频中的1px行，你可以将视频放在一个容器中并且有效地使用它来制作它，尽管这不是最佳的解决方法。此