美文网首页
video 充满父控件 绝对负责

video 充满父控件 绝对负责

作者: _悟_空 | 来源:发表于2021-04-22 10:02 被阅读0次

    video充满父控件 分为两点

    网上的说法都只说了style="object-fit: fill";其实最关键的一步没说 不多说了开代码

      <video
        width="100%" // 这个100% 是指 video标签 充满 外层的父标签
        height="100%"//这个100% 有些低版本的浏览器需要配置这个不然高度会被拉伸
        controls="controls"
        style="object-fit: fill" // 这个属性是指视频的播放区域充满 video这个标签
        @click="click"
        @dblclick="dblclick"
      ></video>
    

    网上的很多都只说style="object-fit: fill" 不说 width="100%" ,经过一天的折磨各种尝试。后面发现根本就不是网上的普遍说法。

    总结

    • 1.video充满外层父标签 需要外层有实际的空间大小(不一定是固定值)然后加上 width="100%"这个属性是video的不在style里面加入。
      1. 视频内容充满video标签 使用style="object-fit: fill"。

    相关文章

      网友评论

          本文标题:video 充满父控件 绝对负责

          本文链接:https://www.haomeiwen.com/subject/xdjxrltx.html