HTML微頁面是一種簡單小巧的網頁,其代碼也不復雜。下面是一個HTML微頁面的基本結構:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>微頁面</title> </head> <body> <h1>這是微頁面標題</h1> <p>這是微頁面內容</p> </body> </html>
代碼解釋:
<!DOCTYPE html>
聲明為 HTML5 文檔類型<html>
表示 HTML 文檔的開始<head>
包含此 HTML 文檔的元數據(例如字符集和頁面標題)<meta charset="UTF-8">
表示此頁面使用 UTF-8 字符集<title>
頁面標題<body>
表示 HTML 文檔的主體(內容部分)<h1>
標題級別 1,表示一個大標題<p>
表示一個段落
可以在此基礎上進行擴展,例如添加圖片、鏈接、表單等。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>微頁面</title> </head> <body> <h1>這是微頁面標題</h1> <img src="img/logo.png" alt="微頁面logo"> <p>這是微頁面內容。<br><br><a >百度一下</a></p> <form action="#" method="post"> <fieldset> <legend>用戶登錄</legend> <label>用戶名:<input type="text" name="username"></label> <label>密碼:<input type="password" name="password"></label> <button type="submit">登錄</button> </fieldset> </form> </body> </html>
這個微頁面添加了圖片、鏈接和登錄表單。