video元素实现运营动效演示页面

展示

代码

• HTML：

  <figure>
      <img src="night.jpg" width="150" height="267">
      <video width="150" height="267" autoplay loop muted playsinline="true" src="fire.mp4"></video>
  </figure>

• CSS：

  figure {
      display: inline-grid;
  }
  video {
      mix-blend-mode: screen;
  }
  figure :is(video, img) {
      grid-area: 1 / 1;
  }