HTML5是網頁設計與實現中的一個重要組成部分。在學習HTML5之前,我們需要先了解HTML5的基礎知識。下面是一些HTML5的常用元素和屬性。
<!DOCTYPE html> <html lang="en"> <head> <title>網站標題</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <header> <h1>網站頭部</h1> <nav> <ul> <li><a href="#">鏈接1</a></li> <li><a href="#">鏈接2</a></li> <li><a href="#">鏈接3</a></li> </ul> </nav> </header> <main> <section> <h2>內容1</h2> <p>段落1</p> <p>段落2</p> </section> <section> <h2>內容2</h2> <ul> <li>列表項1</li> <li>列表項2</li> <li>列表項3</li> </ul> </section> </main> <footer> <p>版權信息</p> </footer> </body> </html>
在HTML5中,<!DOCTYPE html>是必須的,它告訴瀏覽器文檔使用的HTML版本。<html>元素是文檔的根元素,它包含了整個網頁的內容。<head>元素用于定義文檔的頭部,包含了一些元數據,如標題和字符集。<body>元素定義文檔的主體,包含了網頁的實際內容。
在頭部的元數據中,<meta>元素用于定義字符集和視口。字符集用于指定文檔中所使用的字符編碼方式,視口用于控制網頁在移動設備上的顯示方式。<title>元素用于定義網頁的標題,<h1>~<h6>元素用于定義標題的級別,<p>元素用于定義段落。
<header>和<footer>元素分別定義網頁的頭部和尾部,在其中可以包含網頁的信息,如網站的名稱、標語以及版權信息等。<nav>元素用于定義網頁的導航,這里使用了<ul>和<li>元素表示無序列表和列表項。<section>元素用于組織網頁內容的區塊,可以使用<h2>~<h6>元素定義標題,使用<p>元素定義段落,使用<ul>和<li>元素定義列表。