iT邦幫忙

2022 iThome 鐵人賽

DAY 2
0

上次有提到將撰寫好的php程式,通過XAMPP顯示於瀏覽器上,那開始講php程式前,就要先提到HTML。

超文本標記語言(HyperText Markup Language,HTML)是一種用於建立網頁的標準標記語言。HTML(負責網站結構)常與CSS(外觀)、JavaScript(功能性)一起用於設計網頁、網頁應用程式的使用者介面。

寫HTML需要有瀏覽器及編輯器,瀏覽器我是使用Chrome,編輯器則是使用Notepad++,當然也能使用記事本來撰寫,只是功能比較簡單,也很多種編輯器可以使用(Visual Studio Code、UltraEdit…)。

下載Notepad++:
https://ithelp.ithome.com.tw/upload/images/20220917/20152201YcTPGDGGaB.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201hTtZCpl4zP.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201bpJQqkl3IY.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201rtof8rHunU.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201lhwcgVSzJS.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201QRUBMoNbbp.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201JtFO5MPh49.png
https://ithelp.ithome.com.tw/upload/images/20220917/20152201FLD7RbhN1N.png
https://ithelp.ithome.com.tw/upload/images/20220917/201522016WRCtNocUW.png
https://ithelp.ithome.com.tw/upload/images/20220917/201522014mBhaBMblD.png

編輯器打開長這樣
https://ithelp.ithome.com.tw/upload/images/20220917/20152201WvTNBJnw9Y.png

下面簡單介紹HTML程式:

<!DOCTYPE html>
<html>
<head>
<title>HTML程式</title>
</head>
<body>
<h1>標題</h1>
<p>我是內文</p>
</body>
</html>
  • <!DOCTYPE html> DOCTYPE是Document Type的縮寫,意思是文件類型,告訴瀏覽器本這是用HTML5所編成的。
  • <html>與</html>分別代表開始與結束的標記
  • <head>…</head>描述文件基本資訊,不是瀏覽器要顯示出來的內容
  • <title>…</title>網頁的標題
  • <body>…</body>文件的主體,要顯示出來的內容,標題、內文、圖片等。
  • <h1> …</h1>標題
  • <p>…</p>內文

寫完後,檔案要設定為html檔
https://ithelp.ithome.com.tw/upload/images/20220917/20152201EuhTIjN72i.png

程式就能在瀏覽器中呈現了。
https://ithelp.ithome.com.tw/upload/images/20220917/20152201taQqNUyRVR.png

以上就是HTML的簡單介紹

參考資料:
https://zh.wikipedia.org/zh-tw/HTML
https://www.w3schools.com/html/html_intro.asp
https://notepad-plus-plus.org/downloads/


上一篇
前言:挑戰開始
下一篇
HTML常用標籤
系列文
大學每日任務:攝取新知識及學習紀錄30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言