[講義] RWD多頁網頁編輯 (一) skin / navigation / Menu / video 1. 本單元範例下載1.1 head需修改之項目1.2 skins/css/網頁主色設定1.3 等待動畫page-loader1.4 Toggle navigation行動版導覽列/桌機版logo圖檔1.5 導覽列設定/navbar/dropdown1.6 首頁video影片設定 / videowrap影音區塊 / script2. 上課影音1. 本單元範例下載 [color=#FF1493]✱[/color] [url=http://mepopedia.com/~jinjin/ex/rwd-video.zip]範例下載[/url] 學長姐參考範例： http://mepopedia.com/forum/read.php?804,90180,90180#msg-90180 Wed, 26 Aug 2026 09:05:40 +0800 Phorum 5.2.7 http://mepopedia.com/forum/read.php?804,90180,90180#msg-90180 [講義] RWD多頁網頁編輯 (一) skin / navigation / Menu / video http://mepopedia.com/forum/read.php?804,90180,90180#msg-90180
  1. 1. 本單元範例下載
  2. 1.1 head需修改之項目
  3. 1.2 skins/css/網頁主色設定
  4. 1.3 等待動畫page-loader
  5. 1.4 Toggle navigation行動版導覽列/桌機版logo圖檔
  6. 1.5 導覽列設定/navbar/dropdown
  7. 1.6 首頁video影片設定 / videowrap影音區塊 / script
  8. 2. 上課影音

1. 本單元範例下載



[color=#FF1493]✱[/color] [url=http://mepopedia.com/~jinjin/ex/rwd-video.zip]範例下載[/url]

學長姐參考範例：



2. skins/css/網頁主色設定




skin / [color=#CC0066]mycolor.css[/color] 網頁主色設定


使用搜尋快速鍵Ctrl+F(或搜尋與取代Ctrl+shift+F) 將原來色碼替換成欲取代的色碼





3. 等待動畫page-loader


等待動畫，可自行設計gif動畫後替換

<div class="page-loader"> <img src="assets/img/loader.gif" alt=""> </div>

4. Toggle navigation行動版導覽列/桌機版logo圖檔




行動版導覽列logo文字及圖示設定



5. 導覽列設定/navbar/dropdown





導覽列原始碼位置










6. 首頁video影片設定 / videowrap影音區塊 / script




html /script導覽列原始碼位置





html 影片代碼位置修改

?

2. 上課影音


[講義] RWD多頁網頁編輯 (一) skin / navigation / Menu / video
https://youtu.be/ZfnETBim57c

]]> JinJin 網頁設計與語法（HTML/CSS） Tue, 19 Nov 2019 23:19:36 +0800