HackMD
HTML CSS Javascript網頁三兄弟
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
HTML
===
-
HyperText Markup Language的縮寫
-
中文：超文本標記語言
- 標記式語言是什麼？
-> 由很多個<標籤>所組成，
用大小於< >包住你想要的HTML元素，結尾再用大小於包住斜線/+元素<xxx></xxx>
- 標記式語言是什麼？
-
構成網頁的組織架構並呈現網頁的內容（就像最上面的圖的骨頭一樣）
-
網頁內容包括文字、圖片、段落、表格、清單…很多標籤可以使用
-
範例寫法：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>first</title>
</head>
<body>
<h1>fiest</h1>
<p>this is my first html</p>
</body>
</html>
瀏覽器呈現結果：
Image Not Showing
Possible Reasons
- The image file may be corrupted
- The server hosting the image is unavailable
- The image path is incorrect
- The image format is not supported
寫法
- 一定要有
<!DOCTYPE html>這行，因為這是告訴瀏覽器這是一個html檔 <html></html>裡面包覆著<head>跟<body>這個標籤用來包覆整個html 的程式碼- 在<head> 與 <body> 標籤裡面的內容詳述，請詳
CSS
-
Cascading Style Sheets的縮寫
-
中文：層疊樣式表
-
決定網頁的外觀長的怎樣。
可以決定文字表格顏色、字體、編筐設定排版…等(就像最上面的圖他代表人的皮膚及外在的裝飾衣物) -
不可單獨使用需搭配html一同使用
-
可以寫在html裡，也可以以link做連結，連到檔案外以.css做結尾的檔案
-
內容：CSS由多組「規則」組成。每個規則由「選擇器」（selector）、 「屬性」（property）和「值」（value）組成：
- 選擇器（Selector）：多個選擇器可以半形逗號（,）隔開。
- 屬性（property）：CSS1、CSS2、CSS3規定了許多的屬性，目的在控制選擇器的樣式。
- 值（value）：指屬性接受的設定值，多個關鍵字時大都以空格隔開。
屬性和值之間用半形冒號 : 隔開，屬性和值合稱為「特性」。
多個特性間用 ; 隔開，最后用 { } 括起來。
Javascipt
- 簡稱JS，跟Java是不同的語言不要搞混
- 是一種腳本語言，協助我們建立動態網頁，使我們能動態的更新內容、控制多媒體、動畫……等等等。
- 可以寫在html 裡，也可以另外用一個css以link做連結
