跟著AI一起:從零打造一個互動式網站 Day4

網頁製作網頁排版網頁製作網頁 html

wqq 2025-09-23 23:55:44 ‧ 111 瀏覽

分享至

表格與表單基礎
HTML 語意化與結構

HTML 除了基本的 <div>，還有「語意化標籤 (semantic tags)」，可以讓網頁結構更清晰，也有助於 SEO。

常見語意化標籤

<header>：頁首
<nav>：導覽列
<main>：主要內容
<section>：區塊
<article>：文章
<aside>：側邊欄
<footer>：頁尾

🔹小練習

<header>
  <h1>Sunny 的部落格</h1>
</header>

<nav>
  <a href="#">首頁</a> | 
  <a href="#">文章</a> | 
  <a href="#">關於我</a>
</nav>

<main>
  <article>
    <h2>第一篇文章</h2>
    <p>今天開始學前端！</p>
  </article>
</main>

<footer>
  <p>版權所有 © Sunny 2025</p>
</footer>