iT邦幫忙

0

CSS背景影片如何自適應放大縮小

  • 分享至 

  • xImage

CSS背景影片如何自適應放大縮小,手機版時影片無法同步縮小?

    <video autoplay muted loop id="myVideo">
      <source src="video/loop.mp4" type="video/mp4">
      Your browser does not support HTML5 video. </video>

CSS

  • {
    box-sizing: border-box;
    }

body {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 17px;
}
header{
width: 100%;
height: 100vh;
position: relative;
}
#myVideo {
min-width: 100%;
min-height: 100%;
}

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 個回答

1
easthingqq
iT邦新手 5 級 ‧ 2020-07-13 09:57:53
最佳解答

video {
object-fit: cover;
width: 100vw;
height: 100vh;
}

ppp896 iT邦新手 4 級 ‧ 2020-07-13 10:21:24 檢舉

感謝,已解決.謝謝大家回答!

0
listennn08
iT邦高手 5 級 ‧ 2020-07-13 09:42:12
#myVideo {
    width: 100%;
}

我要發表回答

立即登入回答