HTML5代碼全屏代碼是一個非常有用的功能，可以讓網頁內容占據整個屏幕，提高用戶的瀏覽體驗。在HTML5中，通過使用Canvas和JavaScript等技術實現全屏顯示，下面是一段HTML5代碼示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5全屏代碼示例</title>
<style>
#canvasContainer {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
</style>
</head>
<body>
<div id="canvasContainer">
<canvas id="fullScreenCanvas"></canvas>
</div>
<script>
window.onload = function () {
var canvas = document.getElementById('fullScreenCanvas');
canvas.width = window.innerWidth; // 設置canvas寬度為窗口寬度
canvas.height = window.innerHeight; // 設置canvas高度為窗口高度
// 進入全屏模式
canvas.requestFullScreen = canvas.requestFullScreen || canvas.mozRequestFullScreen || canvas.webkitRequestFullScreen;
canvas.requestFullScreen();
// 取消全屏模式
document.exitFullscreen = document.exitFullscreen || document.mozCancelFullScreen || document.webkitExitFullscreen;
canvas.addEventListener('dblclick', function () {
if (document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement) {
document.exitFullscreen();
} else {
canvas.requestFullScreen();
}
}, false);
}
</script>
</body>
</html>從上面的代碼可以看到，我們首先定義了一個Canvas容器div，其寬度和高度都是100%，即占據了整個屏幕。然后在JavaScript中，我們通過調用requestFullScreen方法實現了全屏顯示，退出全屏需要調用exitFullscreen方法。注意，不同瀏覽器對全屏顯示的方法支持不同，需要進行兼容性處理。
上一篇html5代碼入門
下一篇mysql中報1034