HTML5是網絡技術中的一個現代標準，使用HTML5可以創建具有豐富內容的網站和應用程序。在本文中，我們將介紹幾個HTML5的基礎項目，包括源代碼。
首先是一個用HTML5創建的簡單的網頁。以下是源代碼：
<!DOCTYPE html> <html> <head> <title>我的第一個HTML5網頁</title> </head> <body> <h1>歡迎來到我的網頁！</h1> <p>這是一個簡單的HTML5網頁，希望您能喜歡。</p> </body> </html>
以上代碼創建了一個簡單的網頁，包括標題和段落。接下來是一個使用HTML5創建的視頻播放器。以下是源代碼：
<!DOCTYPE html> <html> <head> <title>我的第一個HTML5視頻播放器</title> </head> <body> <video src="movie.mp4" controls> </video> </body> </html>
以上代碼創建了一個簡單的視頻播放器，其中video標簽用于嵌入視頻文件。該標簽還包含一個控件屬性，以便用戶可以控制視頻的播放、暫停和音量等設置。
最后是一個使用HTML5創建的一個簡單的動畫。以下是源代碼：
<!DOCTYPE html>
<html>
<head>
<title>我的第一個HTML5動畫</title>
<script>
function animate() {
var elem = document.getElementById("box");
var pos = 0;
var id = setInterval(frame, 10);
function frame() {
if (pos == 350) {
clearInterval(id);
} else {
pos++;
elem.style.top = pos + 'px';
elem.style.left = pos + 'px';
}
}
}
</script>
</head>
<body>
<div id="box" style="background-color: red; width: 50px; height: 50px; position: relative;" onclick="animate()"></div>
</body>
</html>以上代碼創建了一個簡單的動畫，其中box div元素會在頁面上向右上方移動。此示例使用JavaScript setInterval函數定期更新box元素的位置。
以上是HTML5的幾個基礎項目和其源代碼，希望這些示例有助于您更好地理解HTML5。
上一篇markdown轉css
下一篇mdd和mdx和css