介紹常用之文字編輯器,如 Windows 內建的記事本(Notepad)或是 Mac 內建的 TextEdit。
以記事本或 TextEdit 編寫 HTML
常用的 HTML 編輯器有:
- Notepad++(Windows)
- TextWrangler(OS X)
- Sublime Text(Windows, OS X, Linux)
- Atom(Windows, OS X, Linux)
- Adobe Brackets(Windows, OS X, Linux)
- Microsoft WebMatrix(Windows, OS X, Linux)官方支援至2017年11月1日,建議以 Visual Studio Code 取代
- Visual Studio Code(Windows, OS X, Linux)
雲端文字編輯器:
- codeanywhere(Chrome, iOS, Android)
但對於初學者,還是建議使用Windows內建的記事本(Notepad)或是Mac內建的TextEdit,這樣簡單的文字編輯器有利於學習HTML。
步驟1:開啟編輯器
Windows 10:
按工具列上的搜尋按鈕(左下角數起第2個),輸入「記事本」或「Notepad」。
Windows 8:
進入開始畫面(左下角圖示),輸入「記事本」或「Notepad」。
Windows 7 或之前的版本:
進入開始畫面(左下角圖示),選擇:所有程式 > 附屬應用程式 > 記事本。
Mac機:
- 開啟TextEdit。
- 請確保編輯器的設定是「純文字」:Preferences > New Document > Plain text。
- 同時確保在「Open and Save」中的「Display html file as html code」及「Display RTF file as RTF code」的選項都已選好。
步驟2:寫下第一個HTML檔案
在編輯器輸入或複製以下HTML:
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個標題</h1>
<p>我的第一段段落。</p>
</body>
</html>
步驟3:儲存 HTML 網頁
把檔案儲存在電腦。
- 在記事本功能目錄中,選擇:檔案 > 另存新檔
- 在檔案名稱中,輸入「index.html」或其他名稱+ .html 或 .htm
- 在編碼中,選擇「UTF-8」,否則中文網頁會出現亂碼
步驟4:在瀏覽器打開網頁看
最簡單的網頁已完成了!