Can't change the background behind a text, in which a video is playing inside it-CodePudding

I have made a text inside which a video is playing. I can't change the background, behind the text, to something different that white color. I would like to add a photo as a background instead of white color. I am using tailwind css. Does someone know how to do that?

    <div >
      <div
        
      >
        <video
          
          autoplay
          muted
          loop
          src="../img/barber.mp4"
          type="video/mp4"
        ></video>
        <h1
          
        >
          BARBER
        </h1>
      </div>
    </div>

CodePudding user response：

Tailwind isn't intended to do everything CSS can do. It provides color gradients, but it doesn't sound like that's what you want. Just use some custom styling to apply your background image to the heading element.

<style>
h1.fancy-bg {
  background-image: url(https://via.placeholder.com/800);
  background-size: cover;
  background-position: center;
}
</style>

<div >
  <div
    
  >
    <video
      
      autoplay
      muted
      loop
      src="../img/barber.mp4"
      type="video/mp4"
    ></video>
    <h1
      
    >
      BARBER
    </h1>
  </div>
</div>