Change History
Message: [講義] 單元課程練習整理
Changed By: JinJin
Change Date: September 20, 2017 12:25AM
[講義] 單元課程練習整理
Change Date: September 20, 2017 12:25AM
[講義] 單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: February 17, 2016 09:34PM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: February 17, 2016 09:34PM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
[作業01] 以HTML與CSS完成第一個網頁
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
[作業04] 以CSS製作網頁導覽列
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
[期中作業] 以單欄為主的網站設計
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
[講義05] 繞圖排文與推文按鈕的應用
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
[作業06] 表格的製作
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
[作業07] 以Float：浮動，製作雙欄網頁
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
[作業] 優良設計網站蒐集與分析
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
[期末作業] 以雙欄為主的網站設計
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: August 20, 2015 12:22AM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: August 20, 2015 12:22AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: August 20, 2015 12:21AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Changed By: JinJin
Change Date: August 20, 2015 12:14AM
[講義] 網頁設計單元課程單元課程練習整理
Change Date: August 20, 2015 12:14AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
(2)
(3)
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
edia.com/~web103-a/hw07/hw07-1025445139/team.html
l=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
<h2>[作業01] 以HTML與CSS完成第一個網頁</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
<h2>[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例</h2>
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
<h2>[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇） </h2>
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
<h2>[作業04] 以CSS製作網頁導覽列</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
<b>[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/ </b>
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
<h2>[期中作業] 以單欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
<h2>[講義05] 繞圖排文與推文按鈕的應用</h2>
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
(2)
(3)
[hr]
<h2>[作業06] 表格的製作 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
edia.com/~web103-a/hw07/hw07-1025445139/team.html
l=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
<h2>[作業07] 以Float：浮動，製作雙欄網頁 </h2>
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
<h2>[作業] 優良設計網站蒐集與分析</h2>
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
<h2>[期末作業] 以雙欄為主的網站設計</h2>
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
Original Message
作者: JinJinDate: August 20, 2015 12:13AM
[講義] 網頁設計單元課程單元課程練習整理
每個單元皆會有講義整理，搭配課後練習作業，講義內有語法及影音複習檔，供同學課後複習，請善加利用。
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
(2)
(3)
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
l=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
[hr]
[作業01] 以HTML與CSS完成第一個網頁
1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以HTML與CSS完成第一個網頁[/url]
2.作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
[hr]
[作業02] 利用Div標籤與CSS建立基本網頁版型--以單純色塊為例
1.[url=http://mepopedia.com/forum/read.php?804,16481][講義02] 利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]
2.作業參考
(1) http://mepopedia.com/~web103-c/hw02/hw02-1025445036/
(2) http://mepopedia.com/~web103-a/hw02/hw02-1025445040/
(3) http://mepopedia.com/~web103-a/hw02/hw02-1025445070/
(4) http://mepopedia.com/~web103-a/hw02/hw02-1025445001/
(5) http://mepopedia.com/~web103-a/hw02/hw02-1025445025/
(6) http://mepopedia.com/~web100b/hw02/hw02-1001445055/
(7) http://mepopedia.com/~web100b/hw02/hw02-1001445095/
[hr]
[作業03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）
1.[url=http://mepopedia.com/forum/read.php?804,16271][講義03] 利用Div標籤與CSS建立基本網頁版型（圖片篇）[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw03/
(2) http://mepopedia.com/~web103-a/hw03/hw03-1025445001/
(3) http://mepopedia.com/~web101c/hw03/hw03-1015445231/
(4) http://mepopedia.com/~web100-a/hw03/hw03-1006445010/
(5) http://mepopedia.com/~web101c/hw03/hw03-1015445203/
(6) http://mepopedia.com/~web101c/hw03/hw03-1015445243/Introduction.html
[hr]
[作業04] 以CSS製作網頁導覽列
1.[url=http://mepopedia.com/forum/read.php?804,17032][講義04] 以CSS製作網頁導覽列[/url]
2.作業參考
[color=#0033CC]永遠的印象--莫內，範例網址：[/color]
[color=#CC3366]1.透過CSS，以清單 ＜ul＞及＜li＞製作網頁導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04/ （滑入僅文字變色的導覽列）
http://mepopedia.com/~jinjin/web/hw04-1/ （滑入底色變色及文字置中的導覽列）
[color=#CC3366]2.以圖片按鈕製作的導覽列[/color]
http://mepopedia.com/~jinjin/web/hw04-2/
(1) http://mepopedia.com/~web103-a/hw04/hw04-1025445040/
(2) http://mepopedia.com/~web103-a/hw04/hw04-1005445193/
(3) http://mepopedia.com/~web103-a/hw04/hw04-1025445064/
(4) http://mepopedia.com/~web103-a/hw04/hw04-1025445178/
(5) http://mepopedia.com/~web103-a/hw04/hw04-1025445001/
(6) http://mepopedia.com/~web101c/hw04/hw04-1015445243/
[hr]
[期中作業] 以單欄為主的網站設計
作業參考
(1) http://mepopedia.com/~web100b/midterm/midterm-1001445022/
(2) http://mepopedia.com/~web100b/midterm/midterm-1001445042/
(3) http://mepopedia.com/~web100a/midterm/midterm-1001445068/
(4) http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
(5) http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
(6) http://mepopedia.com/~web103-c/midterm/midterm-1025445069/
[hr]
[講義05] 繞圖排文與推文按鈕的應用
1.[url=http://mepopedia.com/forum/read.php?804,17878,17878][講義05] 繞圖排文與推文按鈕的應用[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw05/story.html
(2)
(3)
[hr]
[作業06] 表格的製作
1.[url=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
[作業07] 以Float：浮動，製作雙欄網頁
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
l=http://mepopedia.com/forum/read.php?804,18062][講義06] 表格的製作 [/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw06-ex/
(2) http://mepopedia.com/~web103-a/hw06/hw06-1025445001/
(3) http://mepopedia.com/~web103-a/hw06/hw06-1025445070/
(4) http://mepopedia.com/~web103-a/hw06/hw06-1025445040/
(5) http://mepopedia.com/~web103-a/hw06/hw06-1005445193/
[hr]
[作業07] 以Float：浮動，製作雙欄網頁
1.[url=http://mepopedia.com/forum/read.php?804,18255][講義07] 以Float：浮動，製作雙欄網頁[/url]
2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/
[hr]
[作業] 優良設計網站蒐集與分析
作業參考
(1) http://mepopedia.com/forum/read.php?2023,68211
[hr]
[期末作業] 以雙欄為主的網站設計
作業參考
(1) http://mepopedia.com/~web100b/final/final-1001445022/
(2) http://mepopedia.com/~web100b/final/final-1001445042/
http://mepopedia.com/~web101c/final/final-1015445243/
(3) http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3)http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(3) http://mepopedia.com/~web101c/final/final-1015445243/
http://mepopedia.com/~web101c/final/final-1015445243-1/
(4) http://mepo pedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943(4) http://mepopedia.com/~web103-a/final/final-1025445124/
(5) http://mepopedia.com/~web103-a/final/final-1025445055/
(6) http://mepopedia.com/~web103-a/final/final-1025445001/
(7) http://mepopedia.com/~web103-a/final/final-1025445040/
(8) http://mepopedia.com/~web103-a/final/final-1025445043/
(9) http://mepopedia.com/~web103-a/final/final-1005445193/
(10) http://mepopedia.com/~web103-a/final/final-1025445070/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881(11) http://mepopedia.com/~web105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?2023,67943
[hr]
OnePage
http://mepopedia.com/~css105-2b/final/final-1045445017/
http://mepopedia.com/~css105-2c/final/final-1045445117/
http://mepopedia.com/forum/read.php?804,84881
MEPO forum
is powered by Phorum.