font awsome 是icon的使用

使用font awsome是icon的library, 可加icon進來豐富網頁

在網頁前要先引用此URL link:

就可以直接使用library內定義好的icon

一般用法可nest在button element裏頭，像下方 element button 後面又nest element i

結果

自動調適對應視窗大小 responsive design

每個前台的視窗大小不一，有手機，平板，筆電

可用responsive design 來自動對應平台

如此html內容就可以適應各種平台了

首先要在html程式最前端include

就可以使用

container-fluid 這支class來優化html內容

refer:

http://www.minwt.com/webdesign-dev/html/9966.html

hexadecimal color code

six digit xxxxxx可代換出一種顏色, 每兩位數一組，依序各代表red green blue
00代表愈暗, FF代表愈亮
red #FF0000
green #00FF00
blue #0000FF
orange #FFA500
gray #808080
dark gray #111111




縮寫把六位數縮寫成三位數
red #F00



函數呈現
rgb(0,0,0)~(255,255,255)
因為16x16剛好是256

green rgb(0,255,0)
blue rgb(0,0,255)
orange rgb(255,165,00)

style Body & inherit & priority & override

一般html裏常見的內容區塊有H1.2.3...和body

可以在sytle裏預先定義好body的屬性

如此一來 內容就會以定義好的clas來呈現

此外，若還有H1, H2...若沒有特別定義，也都會繼承body的style




當然若H1,H2...沒有要繼承body的property的話，就要特別指定給該行

像上圖，特別指pink-text 給h1，就不會繼承body的class了



若同時指定兩種color給h1,會以style裏面最後定義的class給h1
跟在h1裏 class="style1 style2"的順序沒有關係





一個elements 會有多個 class attribute
但可以用id的方式指定給該elements

Remember that our pink-text class was overridden by subsequent class declarations, id declarations, and in-line styles.

override的優先度
!important>inline style>id>subsequent class