HTML5與CSS--網頁版型練習作業說明 請參考 [講義] HTML5與CSS--網頁版型設定： http://mepopedia.com/forum/read.php?804,45304 [hr] 作業步驟1.參考雙欄版型 http://mepopedia.com/~jinjin/web/hw07-102/ 與三欄版型 http://mepopedia.com/~jinjin/web/hw07-102/index-3.html 2.分別嘗試放入內容，並搭配重新的配色與CSS的改變。 3.利用現有的框架，體會區塊版型的應用。 5.將資料夾命名為 hw05-學號，以ＦＴＰ上傳至hw05資料夾 作業網址為http://mepopedia.com/~web102-a/hw05/hw05-1015445XXX 。 並請回覆： (1)作業網址： (2)本頁設計重點： (3)製作心得： 學號 [hr] 請於規定時間準時繳交作業，逾期不後。 [hr] http://mepopedia.com/forum/read.php?1650,45306,45306#msg-45306 Mon, 27 Jul 2026 10:02:29 +0800 Phorum 5.2.7 http://mepopedia.com/forum/read.php?1650,45306,48012#msg-48012 http://mepopedia.com/forum/read.php?1650,45306,48012#msg-48012 三:http://mepopedia.com/~web102-a/hw05/hw05-1015445058/index-1
(2)本頁設計重點： 皆以藍色為主
(3)製作心得： 版型很多很COOL
學號 1015445058]]> 1015445058 102-2《中國》竹視傳二A-進階網頁設計 Mon, 23 Jun 2014 10:42:12 +0800 http://mepopedia.com/forum/read.php?1650,45306,47963#msg-47963 http://mepopedia.com/forum/read.php?1650,45306,47963#msg-47963 雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445015/index-d
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445015/index-t
(2)本頁設計重點：以類似色做搭配，想用比較複古的顏色來呈現網頁的效果，內容是以一些網拍為主要，所以配色用較簡單來帶出質感。
(3)製作心得：雙欄跟三欄其時做起來差不多，比想像中簡單一些。

學號1015445015]]> 1015445015 102-2《中國》竹視傳二A-進階網頁設計 Sun, 22 Jun 2014 23:01:18 +0800 http://mepopedia.com/forum/read.php?1650,45306,47953#msg-47953 http://mepopedia.com/forum/read.php?1650,45306,47953#msg-47953
本頁設計重點:運用英文與色調營造質感

製作心得:網頁真是有趣

1015445056 陳柏儒]]> lovech0128 102-2《中國》竹視傳二A-進階網頁設計 Sun, 22 Jun 2014 19:12:35 +0800 http://mepopedia.com/forum/read.php?1650,45306,47952#msg-47952 http://mepopedia.com/forum/read.php?1650,45306,47952#msg-47952
本頁設計重點:橘黃色的暖色調為主

製作心得:相當有意思

1015445057 王靖淳]]> lovech0128 102-2《中國》竹視傳二A-進階網頁設計 Sun, 22 Jun 2014 19:10:39 +0800 http://mepopedia.com/forum/read.php?1650,45306,47807#msg-47807 http://mepopedia.com/forum/read.php?1650,45306,47807#msg-47807 雙欄:http://mepopedia.com/~web102-a/hw05/hw05-1015445033/index-1
三欄:http://mepopedia.com/~web102-a/hw05/hw05-1015445033/index
(2)本頁設計重點： 以文字性質來選擇顏色\
(3)製作心得： 架構是基礎要學好才是
學號:1015445033]]> mimi51110 102-2《中國》竹視傳二A-進階網頁設計 Sat, 21 Jun 2014 00:54:45 +0800 http://mepopedia.com/forum/read.php?1650,45306,47705#msg-47705 http://mepopedia.com/forum/read.php?1650,45306,47705#msg-47705
雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445044/index
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445044/index-1.html
(2)本頁設計重點：
以溫暖色系為主 有點少女情懷

(3)製作心得：
一大早做網頁 真是一件熱血的事]]> 1015445044 102-2《中國》竹視傳二A-進階網頁設計 Fri, 20 Jun 2014 06:58:48 +0800 http://mepopedia.com/forum/read.php?1650,45306,47700#msg-47700 http://mepopedia.com/forum/read.php?1650,45306,47700#msg-47700 (2)本頁設計重點： 灰黑色，襯托低明度的橘色，達到平衡，卻顯眼的效果
(3)製作心得： 基本的網頁格式欄，練習基礎的網頁格式。

1015445023]]> 陳威翔 102-2《中國》竹視傳二A-進階網頁設計 Fri, 20 Jun 2014 01:30:46 +0800 http://mepopedia.com/forum/read.php?1650,45306,47692#msg-47692 http://mepopedia.com/forum/read.php?1650,45306,47692#msg-47692 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445063/index
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445063/index1
(2)本頁設計重點：藍色為主色 讓人覺得溫馨
(3)製作心得： 可以直接套用 然後修改感覺挺快的]]> 李治頡 102-2《中國》竹視傳二A-進階網頁設計 Thu, 19 Jun 2014 22:39:43 +0800 http://mepopedia.com/forum/read.php?1650,45306,47674#msg-47674 http://mepopedia.com/forum/read.php?1650,45306,47674#msg-47674 参欄式 http://mepopedia.com/~web102-a/hw05/hw05-1015445267/05-2
(2)本頁設計重點： 類似色與相反色相配色練習
(3)製作心得： 比想像中簡單很多
1015445267李金樺]]> 2u04cjo4 102-2《中國》竹視傳二A-進階網頁設計 Thu, 19 Jun 2014 21:45:27 +0800 http://mepopedia.com/forum/read.php?1650,45306,47635#msg-47635 http://mepopedia.com/forum/read.php?1650,45306,47635#msg-47635 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445016/1/index1
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445016/2/index
(2)本頁設計重點：兩種不同風格，一個是熱血足球，一個是溫暖歌詞
(3)製作心得：
這項作業還算容易，套上版型就可以，但是要注意數值不可以出錯]]> top200980 102-2《中國》竹視傳二A-進階網頁設計 Thu, 19 Jun 2014 15:24:32 +0800 http://mepopedia.com/forum/read.php?1650,45306,47623#msg-47623 http://mepopedia.com/forum/read.php?1650,45306,47623#msg-47623 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445019/index
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445019/index1
(2)本頁設計重點：用藍綠色 整體呈現舒服的感覺
(3)製作心得：難]]> money2962 102-2《中國》竹視傳二A-進階網頁設計 Thu, 19 Jun 2014 02:51:57 +0800 http://mepopedia.com/forum/read.php?1650,45306,47607#msg-47607 http://mepopedia.com/forum/read.php?1650,45306,47607#msg-47607 雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445035/
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445035/index3
(2)本頁設計重點： 橘色的感覺~然後發現這配色好像挺大眾的...
(3)製作心得：看懂還有記住版型的位置了~]]> 1015445035 102-2《中國》竹視傳二A-進階網頁設計 Wed, 18 Jun 2014 23:00:09 +0800 http://mepopedia.com/forum/read.php?1650,45306,47585#msg-47585 http://mepopedia.com/forum/read.php?1650,45306,47585#msg-47585 三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445045/index
雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445045/index
(2)本頁設計重點：兩個不同的風格
(3)製作心得：
終於有點懂了，需要花更多時間去鑽研


1015445045]]> AiJie 102-2《中國》竹視傳二A-進階網頁設計 Wed, 18 Jun 2014 20:25:58 +0800 http://mepopedia.com/forum/read.php?1650,45306,47459#msg-47459 http://mepopedia.com/forum/read.php?1650,45306,47459#msg-47459 三欄：http://mepopedia.com/~web102-a/hw05/hw05-1-1015445025/index-t
(2)本頁設計重點： 介紹元佑實業有限公司所賣的相機相關產品，以簡單灰階呈現
(3)製作心得：雙欄式跟三欄式各有優缺點，比較偏好雙欄式，雖然能放的東西空間有限，可是呈現出來比較能一目了然]]> lyy_0920 102-2《中國》竹視傳二A-進階網頁設計 Tue, 17 Jun 2014 21:05:54 +0800 http://mepopedia.com/forum/read.php?1650,45306,47421#msg-47421 http://mepopedia.com/forum/read.php?1650,45306,47421#msg-47421 雙欄 http://mepopedia.com/~web102-a/hw05/hw05-1015445038/index1
三欄 http://mepopedia.com/~web102-a/hw05/hw05-1015445038/index

(2)本頁設計重點： 依自己的想法配色

(3)製作心得： 看似麻煩 但一步一步去做 似乎就是這樣的簡單 去了解就會懂一些小語法了 (:P)]]> 1015445038a 102-2《中國》竹視傳二A-進階網頁設計 Tue, 17 Jun 2014 17:20:21 +0800 http://mepopedia.com/forum/read.php?1650,45306,47418#msg-47418 http://mepopedia.com/forum/read.php?1650,45306,47418#msg-47418 雙欄 http://mepopedia.com/~web102-a/hw05/hw05-1015445017/index-1
三欄 http://mepopedia.com/~web102-a/hw05/hw05-1015445017/index

(2)本頁設計重點： 以自己的心情來配色，不用顧慮太多

(3)製作心得： 簡單的告訴我們怎麼去排版。

1015445017]]> 1015445017 102-2《中國》竹視傳二A-進階網頁設計 Tue, 17 Jun 2014 16:51:04 +0800 http://mepopedia.com/forum/read.php?1650,45306,47417#msg-47417 http://mepopedia.com/forum/read.php?1650,45306,47417#msg-47417 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445008/index-1
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445008/index

本頁設計重點： orange

製作心得： 其實不會很難]]> Dx_is818099 102-2《中國》竹視傳二A-進階網頁設計 Tue, 17 Jun 2014 16:36:19 +0800 http://mepopedia.com/forum/read.php?1650,45306,47393#msg-47393 http://mepopedia.com/forum/read.php?1650,45306,47393#msg-47393 三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445007/index-3.html
(2)本頁設計重點：想到現在是夏天了，所以使用暖色系

(3)製作心得：
剛開始發現怎麼都是錯的，檢查了很久後才發現是檔案名稱的關西]]> 1015445007 102-2《中國》竹視傳二A-進階網頁設計 Tue, 17 Jun 2014 13:19:40 +0800 http://mepopedia.com/forum/read.php?1650,45306,47298#msg-47298 http://mepopedia.com/forum/read.php?1650,45306,47298#msg-47298 雙欄式 http://mepopedia.com/~web102-a/hw05/hw05-1015445059/index
三欄式 http://mepopedia.com/~web102-a/hw05/hw05-1015445059/index-1
(2)本頁設計重點：以對比色做色塊上的搭配，有強烈對比效果。
(3)製作心得：讓我又學到一種新的版型設計，很有趣也很好玩。
學號：1015445059]]> 1015445059 102-2《中國》竹視傳二A-進階網頁設計 Sun, 15 Jun 2014 22:11:21 +0800 http://mepopedia.com/forum/read.php?1650,45306,47170#msg-47170 http://mepopedia.com/forum/read.php?1650,45306,47170#msg-47170 二欄式 - http://mepopedia.com/~web102-a/hw05/hw05-1015445014/index
三欄式 - http://mepopedia.com/~web102-a/hw05/hw05-1015445014/index-3
(2)本頁設計重點：馬卡龍色、粉嫩感
(3)製作心得：看起來很簡單但不容易
1015445014]]> 妞妞小 102-2《中國》竹視傳二A-進階網頁設計 Tue, 10 Jun 2014 13:57:50 +0800 http://mepopedia.com/forum/read.php?1650,45306,47111#msg-47111 http://mepopedia.com/forum/read.php?1650,45306,47111#msg-47111 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445022/index-1
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445022/index
(2)本頁設計重點： 以類似彩妝、化妝品牌的顏色做基調。
(3)製作心得：
套上版型真的很如容易上手，自己打真的會花上好長一段時間。]]> 1015445022 102-2《中國》竹視傳二A-進階網頁設計 Sat, 07 Jun 2014 14:31:13 +0800 http://mepopedia.com/forum/read.php?1650,45306,46238#msg-46238 http://mepopedia.com/forum/read.php?1650,45306,46238#msg-46238 三http://mepopedia.com/~web102-a/hw05/hw05-1015445055/index

(2)本頁設計重點： 類似色與低飽和的搭配
(3)製作心得：
配色真的很深奧

1015445055]]> wl02353198 102-2《中國》竹視傳二A-進階網頁設計 Tue, 13 May 2014 13:59:04 +0800 http://mepopedia.com/forum/read.php?1650,45306,46231#msg-46231 http://mepopedia.com/forum/read.php?1650,45306,46231#msg-46231 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445268/index2.html
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445268/index.html

(2)本頁設計重點： 溫和甜美的糖果配色

(3)製作心得： 配色不容易,要算準雙欄和三欄的數值都要很小心.]]> 1015445268 102-2《中國》竹視傳二A-進階網頁設計 Tue, 13 May 2014 09:39:24 +0800 http://mepopedia.com/forum/read.php?1650,45306,46223#msg-46223 http://mepopedia.com/forum/read.php?1650,45306,46223#msg-46223 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445010/index-1.html
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445010/index.html
(2)本頁設計重點： 繽紛色彩為主
(3)製作心得：
套上版型就可以改來改去 很有趣]]> 鄔惠婷 102-2《中國》竹視傳二A-進階網頁設計 Tue, 13 May 2014 00:23:59 +0800 http://mepopedia.com/forum/read.php?1650,45306,46219#msg-46219 http://mepopedia.com/forum/read.php?1650,45306,46219#msg-46219
雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445048/index
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445048/index2

(2)本頁設計重點：
雙欄式用很像糖果甜甜的色調下去搭配
三欄式用感覺比較酸的糖果色系下去配

(3)製作心得：
網頁真的好難~QQ 期末怎麼辦~怎麼辦~怎麼辦~

學號
1015445048]]> 1015445048 102-2《中國》竹視傳二A-進階網頁設計 Mon, 12 May 2014 20:38:39 +0800 http://mepopedia.com/forum/read.php?1650,45306,45975#msg-45975 http://mepopedia.com/forum/read.php?1650,45306,45975#msg-45975
雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445043
三欄： http://mepopedia.com/~web102-a/hw05/hw05-1015445043-2

(2)本頁設計重點：

全部都粉~紅~色~

(3)製作心得：

改顏色全部都粉紅色好好玩

學號

1015445043]]> emaly83315 102-2《中國》竹視傳二A-進階網頁設計 Fri, 09 May 2014 14:23:14 +0800 http://mepopedia.com/forum/read.php?1650,45306,45811#msg-45811 http://mepopedia.com/forum/read.php?1650,45306,45811#msg-45811 雙欄http://mepopedia.com/~web102-a/hw05/hw05-1015445054/index
三欄http://mepopedia.com/~web102-a/hw05/hw05-1015445054-1/index
(2)本頁設計重點： 先用圖片再用顏色很好配色
(3)製作心得：
喜歡玩配色，因為很好玩，這樣才有心情研究語法]]> 1015445054 102-2《中國》竹視傳二A-進階網頁設計 Tue, 06 May 2014 13:58:31 +0800 http://mepopedia.com/forum/read.php?1650,45306,45800#msg-45800 http://mepopedia.com/forum/read.php?1650,45306,45800#msg-45800
雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445027/index
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445027/index2

(2)本頁設計重點：
用橘紅色來襯托戀愛的樣子
酸酸甜甜的感覺

(3)製作心得：
雖然知道網頁真的很重要 但真的很不想在學網頁了！

學號
1015445027]]> 1015445027 102-2《中國》竹視傳二A-進階網頁設計 Tue, 06 May 2014 03:56:10 +0800 http://mepopedia.com/forum/read.php?1650,45306,45799#msg-45799 http://mepopedia.com/forum/read.php?1650,45306,45799#msg-45799
雙欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445018/
三欄：http://mepopedia.com/~web102-a/hw05/hw05-1015445018/index.html2

(2)本頁設計重點：

使用基本的黑灰階來襯托,中間留白凸顯重點
襯托政府的黑暗

(3)製作心得：
蜀道難 難與上天

學號

1015445018]]> 1015445018 102-2《中國》竹視傳二A-進階網頁設計 Tue, 06 May 2014 03:51:20 +0800 http://mepopedia.com/forum/read.php?1650,45306,45794#msg-45794 http://mepopedia.com/forum/read.php?1650,45306,45794#msg-45794 雙欄:http://mepopedia.com/~web102-a/hw05/hw05-1015445060/index
三欄:http://mepopedia.com/~web102-a/hw05/hw05-1015445060/index-3
(2)本頁設計重點： 以大地森林色系為主，讓人有放鬆的感覺。
(3)製作心得： 是一種新的版型，看起來更有架構了。
學號:1015445060]]> 1015445060 102-2《中國》竹視傳二A-進階網頁設計 Tue, 06 May 2014 01:57:16 +0800