在HTML5全屏视频的右上角添加X

<video src="video.mp4" width="640" height="360" controls></video>

<div class="close-button">X</div>

.close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 20px;
  color: #fff;
  cursor: pointer;
}

var closeButton = document.querySelector('.close-button');
var video = document.querySelector('video');

closeButton.addEventListener('click', function() {
  if (document.exitFullscreen) {
    document.exitFullscreen();
  } else if (document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if (document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  } else if (document.msExitFullscreen) {
    document.msExitFullscreen();
  }
  
  video.style.display = 'none';
});