iT邦幫忙

2025 iThome 鐵人賽

DAY 7
0
生成式 AI

30天製作生成式AI的互動網頁專案系列 第 7

Day-7 HTML網頁的基礎-1

  • 分享至 

  • xImage
  •  

HTML 網頁設計基礎:

HTML(HyperText Markup Language)是建立網頁的基礎語言,主要用來描述網頁的結構與內容。它透過「標籤(tag)」來定義元素,例如標題、段落、圖片、超連結等。常見的基本結構包含三大部分:

  1. !DOCTYPE html:宣告這是一個 HTML5 文件。
  2. html 標籤:整個網頁的根元素。
  3. head 標籤:放置網頁的設定,例如標題(title)、字元編碼(meta)、CSS 樣式等。
  4. body 標籤:網頁的主要內容,包含文字、圖片、連結與表單。

HTML 的設計是階層式的,元素之間會互相嵌套。例如一個段落(p)可以包含文字與超連結(a)同時,HTML 通常會搭配 CSS(階層式樣式表) 來設定外觀,並與 JavaScript 搭配來提供互動功能。

HTML 不需要編譯,只要用瀏覽器開啟 .html 檔案就能顯示結果。因此,它是學習網頁開發的第一步。

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>我的第一個網頁</title>
</head>
<body>
    <h1>歡迎來到我的網頁</h1>
</body>
</html>

HTML 是網頁的骨架,定義了內容與結構;CSS 負責美化,JavaScript 則提供互動。透過這三者的結合,就能建立出完整、動態的網站。下一篇將會介紹一些實用的標籤跟會用到的標籤。


上一篇
Day-6 flask網頁設計的基礎-2
系列文
30天製作生成式AI的互動網頁專案7
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言