認真的F
@MajimeF
Mon, Oct 25, 2021 2:57 PM
Mon, Oct 25, 2021 3:20 PM
2021/10/25（一）
線上課程 網頁開發 學習進度 進度紀錄 60/554。複習日。
https://www.udemy.com/...
49-51。CSS。
認真的F
@MajimeF
Mon, Oct 25, 2021 2:58 PM
上一噗：
@MajimeF - 2021/10/24（日） #線上課程 #網頁開發 #學習進度 #進度紀錄 60/...
認真的F
@MajimeF
Mon, Oct 25, 2021 2:58 PM
此課程 書籤噗 ：
@MajimeF - #書籤噗 #線上課程學習紀錄 #網頁開發
認真的F
@MajimeF
Mon, Oct 25, 2021 2:59 PM
49-51
開始進入CSS。基本的介紹。
之前只有先看過去+一點實做而已XD
認真的F
@MajimeF
Mon, Oct 25, 2021 3:02 PM
CSS＝Cascading Style Sheets
階層式樣式表

可以給網站加入許多樣式（字體、字型、寬度、背景顏色等）。

階層式的意思之後的課程再提。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:06 PM
CSS Syntax
syntax 語法＝程式語言的文法。

h1{
color: green;
}
（給<h1>標籤加上字型顏色：綠色）

一定要加分號，代表結束。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:09 PM
050、CSS 程式碼放置位置
有三種
inline Styling 在該行中
internal Stying 在頁面內部
external Stying 在頁面之外
認真的F
@MajimeF
Mon, Oct 25, 2021 3:12 PM
【inline Styling】
<h1 style="color: darkblue">標題1</h1>
直接在標籤中指定樣式。

這樣這個「標題1」就會變成深藍色。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:13 PM
【internal Styling】
<head>
<style>
h1 {
color: red;
}
</style>
</head>

在<head>中間加入樣式。
這樣這一頁的<h1>就會全部變色。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:16 PM
【external Styling】
在 .html 之外，另外建立一個「.css」文件（名稱自訂）。

<head>
<link rel="stylesheet" href="style.css" />
</head>

在<head>中間加入「link」與之連結。
範例是連結到「style.css」這個檔案。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:18 PM
rel＝relationship 代表此文件將與此網頁建立關係。

每一個想套用的網頁，都加入這個連結。
這樣有加入的就會套用裡面的設定。

以後想修改也只要更動「.css」檔案即可～
全部連結的都會一起變動。
認真的F
@MajimeF
Mon, Oct 25, 2021 3:19 PM
基本上都是用 external Styling 。
方便省事，需要修改時不用改一大堆。

不過 inline Styling 也有特定實用功能…
之後會介紹。
載入新的回覆