To achieve this, you can use the following HTML code:

<video autoplay loop muted playsinline style="object-fit: cover; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -1;">
  <source src="your-video-file.mp4" type="video/mp4">
</video>

Explanation of the code:

  • autoplay - This attribute automatically starts playing the video when the page loads.
  • loop - This attribute makes the video play in a loop, repeating it after it ends.
  • muted - This attribute mutes the video so that it doesn't play any sound.
  • playsinline - This attribute allows the video to play inline on mobile devices.
  • style="object-fit: cover; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -1;" - This inline style sets the video to cover the entire screen, with a fixed position and a z-index of -1 to make sure it stays in the background.
  • <source src="your-video-file.mp4" type="video/mp4"> - This is where you specify the source file of your video and its file type.

Note that some browsers may not support autoplay or loop, so make sure to test your page on different browsers to ensure it works as intended

video tag in html full height and width and has cover auto play and loop without any controls

原文地址: https://www.cveoy.top/t/topic/eFAi 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录