Embedded Files
準備工作：
啟動Google Chrome：右上角登入電子郵件。
Google Chrome瀏覽器帳號登入同步與刪除說明：這樣你登入ChatGPT、Gemini...登入上課用軟體就方便多了。
安全說明：使用別人的電腦別再登出Chrome瀏覽器?請注意自己帳號的安全，共用電腦或公共電腦使用之後請記得登出。
ChatGPT：就是OPEN AI的人工智慧對話軟體，詢問簡單的問題可以用免費版就好。註冊、登入。
Gemini：Google 的AI人工智慧對話軟體。註冊、登入。
NotebookLM AI：Google 的AI資料整理。註冊、登入。
Gamma ：投影片生成軟體用這個聯結推薦+200點AI點
W3CSchool 網頁與程式入門練習
要記住的指令
<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8"> <!-- 設定編碼，避免亂碼 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 手機/電腦都能適配 -->
<title>我的第一個網頁</title> <!-- 瀏覽器標題列文字 -->
</head>
<body>
<h1>哈囉，世界！</h1> <!-- 頁面主標題 -->
<p>這是一個簡單的 HTML 範例。</p> <!-- 段落文字 -->
</body>
</html>
解說：----------------------------------------
一個最標準的 HTML 檔案基本格式，這是每個網頁最常用的結構：
<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8"> <!-- 設定編碼，避免亂碼 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 手機/電腦都能適配 -->
<title>我的第一個網頁</title> <!-- 瀏覽器標題列文字 -->
</head>
<body>
<h1>哈囉，世界！</h1> <!-- 頁面主標題 -->
<p>這是一個簡單的 HTML 範例。</p> <!-- 段落文字 -->
</body>
</html>
結構說明
<!DOCTYPE html>
宣告文件是 HTML5 格式，瀏覽器才知道怎麼正確解析。<html lang="zh-Hant"> ... </html>
整個網頁的根元素，lang="zh-Hant" 表示繁體中文。<head> ... </head>
放置網頁的 設定與資訊（像是編碼、標題、關鍵字、CSS、JS 連結）。<body> ... </body>
放置實際 顯示在網頁上的內容（文字、圖片、按鈕…）。
要不要我幫您整理一份 HTML 基礎速查表 (Cheat Sheet)，讓您快速掌握 <h1>~<h6>、<p>、<a>、<img>、<div> 等常用標籤？
一定要會的基本能力
製作一個文字版網頁，文字內容、字體大小、字體顏色均可以指定。
Page updated
Google Sites
Report abuse