Change History

<h2>參照 
[講義] OnePagRWD-OnePage網頁實作解析(一)輪播圖-Grid System格線系統 </h2>

[講義] OnePage網頁實作解析(一)輪播圖-Grid System格線系統
<a href="http://mepopedia.com/forum/read.php?804,87859" target="_blank'><b>http://mepopedia.com/forum/read.php?804,87859</b></a>

[講義] OnePage網頁實作解析(二）相片分類與燈箱效果、地圖設定
<a href="http://mepopedia.com/forum/read.php?804,87905" target="_blank'><b>http://mepopedia.com/forum/read.php?804,87905</b></a>

<hr>
<h2>作業說明</h2>
1.請以個人網站、作品集或自己有趣的主題製作，✷站內容與作品須原創✷，不可使用他人作品，✷如需使用他人作品須取得授權✷。

2.請以老師上課版型製作，或者參照免費版型，挑選一適合期中作業主題的版型，結合選擇之版型製作。
OnePage免費版型資源
https://onepagelove.com/templates
https://startbootstrap.com/template-categories/one-page/
https://colorlib.com/wp/best-one-page-wordpress-themes/

tooplate

http://www.tooplate.com/free-templates
templatemo

http://www.templatemo.com/page/1
Free CSS Free CSS Templates, CSS Layouts & More! 

http://www.free-css.com/free-css-templates
HTMLl5UP

https://html5up.net
W3.CSS Templates

https://www.w3schools.com/w3css/w3css_templates.asp
Free Responsive HTML5 CSS3 Website Templates 

https://medium.com/web-development-zone/free-responsive-html5-css3-website-templates-bcbe3f8a20b9

3.需完成之製作項目：
(1)使用圖示字體(icon font) Font Awesome。
(2)製作輪播圖
(3)了解網頁格線概念，並進行修改。
(4)製作作品相簿分類，並進行修改。
(5)製作地圖嵌入。

4.製作完畢請上傳FTP，midterm資料夾。

請回覆於作業文章

(1) 作業網址 ：http://file.mepopedia.com/~css108b/midterm/midterm-105ooooo

(2) 參考之版型網址：
(3) 設計主題 / 風格：
(4) 導覽列項目：
(5) 遇到之問題:
(6) 製作時間:
(7) 製作心得:

[hr]
<h2>製作進度</h2>
第六週　10/16　OnePage網頁實作/使用圖示字體(icon font) Font Awesome
http://mepopedia.com/forum/read.php?804,87786
第七週　10/23　OnePage網頁實作/slider /Grid system
第八週　10/30　OnePage網頁實作/相簿 /地圖
第九週　11/06　RWD網站製作/案例分析/問題討論
第十週　11/13　期中作業發表與檢討

[hr]
<h2>參考範例</h2>
http://ftp.mepopedia.com/~css107a/midterm/midterm-1065445121/

1.畢業專題

http://mepopedia.com/~css105-2a/lion_candy/

2. 活動網站
http://ccnt1.cute.edu.tw/cpland/4e/
http://ccnt1.cute.edu.tw/cpland/future/

http://www.cute.edu.tw/dvcd/master/

3. 品牌與導覽網站設計

http://ccnt1.cute.edu.tw/cpland/4e/
http://www.cute.edu.tw/dvcd/lieyu/


[hr]

<h2>課程影片</h2>
https://youtu.be/aGO1GQxbwTI

<iframe width="835" height="480" src="https://www.youtube.com/embed/aGO1GQxbwTI?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

[hr]

https://youtu.be/BrslTed-BB4

<iframe width="853" height="480" src="https://www.youtube.com/embed/BrslTed-BB4?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

參照 【講義】�[講義] OnePagRWD-OnePage網頁實作解析(一)輪播圖-G

【講義】rid System格線系統

[講義] OnePage網頁實作解析(一)輪播圖-Grcom/forum/read.php?804,87859" target="_blank'>htt
edia.com/forum/read.php?804,87859��
(5) 遇到之問題:
(6) 製作時間:
(7) 製作心得:

[hr]

製作進度

第六週　10/16　OnePage網頁實作/使用圖示字體(icon font) Font Awesome
第七週　10/23　OnePage網頁實作/slider /Grid system
第八週　10/30　OnePage網頁實作/相簿 /地圖
第九週　11/06　RWD網站製作/案例分析/問題討論
第十週　11/13　期中作業發表與檢討

[hr]

參考範例 http://ccnt1.c

作業說明

1.可從免費版型中挑選適合的版型修改。
DreamTemplate

http://www.dreamtemplate.com

tooplate

http://www.tooplate.com/free-templates

templatemo

http://www.templatemo.com/page/1

Free CSS Free CSS Templates, CSS Layouts & More! 

http://www.free-css.com/free-css-templates

HTMLl5UP

https://html5up.net

W3.CSS Templates

https://www.w3schools.com/w3css/w3css_templates.asp

Free Responsive HTML5 CSS3 Website Templates 

https://medium.com/web-development-zone/free-responsive-html5-css3-website-templates-bcbe3f8a20b9


OnePage免費版型資源

https://onepagelove.com/templates
https://startbootstrap.com/template-categories/one-page/
https://colorlib.com/wp/best-one-page-wordpress-themes/

2.設定好主題及網站風格。主題須為原創，不可使用他人作品。

3.本週進度：

(1)修改前置設定，包含語系、網站描述等

(2)導覽列文字修改

(3)輪播圖片及文字修改

(4)格線系統版式修改

(5)Font Awesome修改

4.上傳至hw04資料夾，並回覆於作業文章

(1).網址: ：http://mepopedia.com/~web106-2b/hw04/hw04-105ooooo

(2).版型網址：

(3).主題、風格：

(4).設計概念與製作心得：

---

講義影音

問題:
(6) 製作時間:
(7) 製作心得:

[hr]

製作進度

第六週　10/16　OnePage網頁實作/使用圖示字體(icon font) Fon第七週　10/23　OnePage網頁實作/slider /Grid system
第八週　10/30　OnePage網頁實作/相簿 /地圖
第九週　11/06　RWD網站製作/案例分析/問題討論
第十週　11/13　期中作業發表與檢討

[hr]

參考範例

http://ftp.mepopedia.com/~css107a/midterm/midterm-1065445121/

1.畢業專題

http://mepopedia.com/~css105-2a/lion_candy/

2. 活動網站
http://ccnt1.cute.edu.tw/cpland/4e/
http://ccnt1.cute.edu.tw/cpland/future/

http://www.cute.edu.tw/dvcd/master/

3. 品牌與導覽網站設計

http://ccnt1.cute.edu.tw/cpland/4e/
http://www.cute.edu.tw/dvcd/lieyu/


[hr]

課程影片

https://youtu.be/aGO1GQxbwTI


��作/slider /Grid system
第八週　10/30　OnePage網頁實作/相簿 /地圖
第九週　11/06　RWD網站製作/案例分析/問題討論
第十週　11/13　期中作業發表與檢討

[hr]

參考範例

http://ftp.mepopedia.com/~css107a/midterm/midterm-1065445121/

1.畢業專題

http://mepopedia.com/~css105-2a/lion_candy/

2. 活動網站
http://ccnt1.cute.edu.tw/cpland/4e/
http://ccnt1.cute.edu.tw/cpland/future/

http://www.cute.edu.tw/dvcd/master/

3. 品牌與導覽網站設計

http://ccnt1.cute.edu.tw/cpland/4e/
http://www.cute.edu.tw/dvcd/lieyu/


[hr]

課程影片

https://youtu.be/aGO1GQxbwTI



[hr]

https://youtu.be/BrslTed-BB4