內容寬度為方框，如果網站有設定頁寬，就與設定同寬
內容寬度為全寬，螢幕多寬就多寬
VH和VW設定為100就是全螢幕
Justify content 設定為置中，就是垂直置中
Align Items 設定為置中，就是水平置中
圖片背景預設是依照container內容大小顯示
圖片背景預設是依照container內容大小顯示
預設是會重複，而且依照原大小放置
點選不重複就只出現單圖
每一個元件都可以設定游標暫留效果，例如改變圖片
設定為幻燈片，並加入動畫效果，
可以產生很專業的橫幅背景
用影片當背景
在電腦版螢幕相當壯觀
但是會延遲載入時間
加入背景覆蓋
加入背景覆蓋
讓字體更清晰
container的預設排列是直排
點選箭頭可以變成橫排
設定回應式可以根據螢幕大小顯示或隱藏物件
物件的大小比例可以用滑鼠拖拉變更
字體有各種大小，色彩和樣式的基本設定要從網站設定修改
H1字體
H2字體
H3字體
H4字體
H5字體
H6字體
內文
標題是為單行文字設計
內容編輯器是為多行設計
除了多行
還可以加入圖片
或者是編號清單
例如
- 豆花
- 熱豆花
- 薑汁豆花
- 熱薑汁豆花
或者是項目符號
例如
- 這是一點
- 這是重點
- 這是一點點重點
- 這是重複的一點點重點
加入圖片時可以在圖片編輯器中改變大小，但是要儲存才會生效
圖片的大小可以設定為固定尺寸，或者自設尺寸，但尺寸超過container時，不會顯示得更大，也不會裁切
圖片下方可以加上說明（caption），可以自訂也可以使用標題說明文字
圖片可以打圓角，做出有美編的效果
也可以打上陰影做出立體感
加入游標懸停動畫
套用遮罩可以改變裁切形狀
按鈕的顏色，大小，字體都可以自由調整
按鈕可以加入自訂的SVG圖示
也可以使用系統圖示
按鈕可以只有圖示
設定為固定就可以做成側邊的電話按鈕
加入超連結，所有元件都可以變成按鈕
除了選單錨點以外，其他超連結都要刪除#
超連結的格式有幾種
“http://zmusic.tw”
可以連到外部網頁或內部網頁
“/courses”
只能連到內部
“#加上元件名稱”
可以跳到特定段落，但是需要先插入選單錨點，並用英文命名
tel:+8869999999
可以直接打電話
加入line官方帳號的連結，就直接打開line
把邊界設定為負值可以做出破框效果
多應用動態元件，可以讓網站有設計感，但是"懸浮"才有的動畫在手機上無法啟動
頁面太長，可以添加回到頂端按鈕
打開頁面設置往下拉就可以找到了
做好元件後，要確認不同螢幕的顯示情形，再調整大小，陰影，或者放不同背景
想像很美好，現實很骨感
實做-請做出如以下具有幻燈片效果的區段，加上文字和背景覆蓋，並調整版面的適應性
為孩子點亮學習的星光
專業師資嚴選｜升學權威 × 雙語認證，精準拆解考題，成績進步看得見！
安全溫馨環境｜24H智能監控 × 專人接送，家長安心託付的學習基地。
個人化課輔｜AI學力診斷 + 小班制教學，薄弱科目全面提升，自信扎根。
多元成長舞台｜科學實驗營、辯論賽、戶外探索，玩出創造力與團隊力！
讓每個孩子不只「跟上進度」，更能閃耀獨特光芒！
