HTML 如何切换全屏模式 - 简单示例

您需要使用 JavaScript 来切换全屏模式。以下是一个简单的示例：

HTML：

<div id='myFullscreenElement'>This is my element to make fullscreen</div>
<button onclick='toggleFullScreen()'>Toggle fullscreen</button>

JavaScript：

function toggleFullScreen() {
  var elem = document.getElementById('myFullscreenElement');
  if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {  
    if (elem.requestFullscreen) {
      elem.requestFullscreen();
    } else if (elem.msRequestFullscreen) {
      elem.msRequestFullscreen();
    } else if (elem.mozRequestFullScreen) {
      elem.mozRequestFullScreen();
    } else if (elem.webkitRequestFullscreen) {
      elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
    }
  } else {
    if (document.exitFullscreen) {
      document.exitFullscreen();
    } else if (document.msExitFullscreen) {
      document.msExitFullscreen();
    } else if (document.mozCancelFullScreen) {
      document.mozCancelFullScreen();
    } else if (document.webkitExitFullscreen) {
      document.webkitExitFullscreen();
    }
  }
}

这将在单击按钮时切换全屏模式，并将myFullscreenElement元素设置为全屏。您可以根据需要更改元素ID和按钮文本。