“cara menambahkan video di latar belakang di html” Kode Jawaban

cara menambahkan video latar dalam html

<video id="background-video" autoplay loop muted poster="https://assets.codepen.io/6093409/river.jpg">
  <source src="https://assets.codepen.io/6093409/river.mp4" type="video/mp4">
</video>

<h1>THIS IS A RIVER.</h1>
<h2>How majestic.</h2>

<style>
  /* video background */
  #background-video {
    height: 100vh;
    width: 100vw;
    object-fit: cover;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
  }

  /* page content */
  h1, h2 {
    color: white;
    font-family: Trebuchet MS;
    font-weight: bold;
    text-align: center;
  }

  h1 {
    font-size: 6rem;
    margin-top: 30vh; 
  }

  h2 { font-size: 3rem; }

  @media (max-width: 750px) {
      #background-video { display: none; }
      body {
        background: url("https://assets.codepen.io/6093409/river.jpg") no-repeat;
        background-size: cover;
      }
  }
</style>
Upset Unicorn

cara menambahkan video di latar belakang di html

How to create a full screen video background.
source: w3schools.com

<!-- The video -->
<video autoplay muted loop id="myVideo">
  <source src="backgroundVideo.mp4" type="video/mp4">
</video>

<!-- Optional: some overlay text to describe the video -->
<div class="content">
  <h1>Heading</h1>
  <p>Lorem ipsum...</p>
  <!-- Use a button to pause/play the video with JavaScript -->
  <button id="myBtn" onclick="myFunction()">Pause</button>
</div>
Pharos

cara menambahkan video di latar belakang html

<video autoplay loop muted id="backgroundVideo">
  <source src="background.mp4" type="video/mp4">
</video>

<style>
	#backgroundVideo {
      position: absolute;
      right: 0;
      bottom: 0;
      min-width: 100%;
      min-height: 100%;
      overflow: hidden;
    }
</style>
I_Like_Cats__

Jawaban yang mirip dengan “cara menambahkan video di latar belakang di html”

Pertanyaan yang mirip dengan “cara menambahkan video di latar belakang di html”

Lebih banyak jawaban terkait untuk “cara menambahkan video di latar belakang di html” di HTML

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya