iT邦幫忙

2024 iThome 鐵人賽

DAY 5
0
佛心分享-IT 人自學之術

HTML&CSS網頁設計學習心得系列 第 5

Day5:如何建立HTML檔案&建立網頁標題&輸入網頁內文

  • 分享至 

  • xImage
  •  

1)如何建立HTML檔案
首先,啟動文字編輯器,例如Notepad++或VS Code,開始撰寫HTML原始碼。在剛開啟編輯器時,會看到歡迎畫面和多個視窗。使用者需要執行「檔案」菜單中的「新增文件」命令,這樣在最右邊的窗格標籤會顯示「untitled」。此時,可以開始編寫HTML原始碼,包含必要的標籤和內容。完成後,選擇「儲存檔案」,並在儲存時將檔案命名為「index.html」,確保檔案的副檔名為.html。最後,使用網頁瀏覽器(如Chrome或Firefox)來開啟這個檔案,檢視剛剛創建的網頁效果。

2)建立網頁標題
在HTML中,“h”是英文“heading”的縮寫,表示標題。後面的數字越大,顯示的標題尺寸越小。例如, 是最大的標題, 則是最小的。你可以用 到 標籤來建立各級標題,這樣有助於組織內容的層次結構。撰寫方式如:顯示一級標題、顯示二級標題、顯示三級標題,依此類推。

3)輸入網頁內文
在網頁中輸入內容時,可以使用 標籤來顯示文章段落。這樣的標籤不僅清晰易讀,還能有效地分隔文本段落。例如,使用範例:WCB CAFE提供有益身體健康的自然食物,主要特色是菜單選用了無人工添加物的食材。。這樣的寫法有助於提高網站的可讀性,讓訪客能輕鬆獲取資訊。

4)插入影像
用標籤插入影像(且需要設定src,alt屬性:<img src="sakura.jpg "alt= "美麗的櫻花">)src設定要顯示哪張圖片?alt則是在網頁無法順利地載入圖像時,取代影像顯示在網頁上的文字之後設定檔案的路徑(指用來呼叫或連結的檔案)


上一篇
Day4:如何在HTML中使用CSS?
下一篇
Day6:設定連結&顯示項目清單&建立CSS檔案
系列文
HTML&CSS網頁設計學習心得12
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言