Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

[作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

103-2《中國》竹視傳二C-進階網頁設計 文章列表 發表文章 PDF 列印（下載）
JinJin [ 站內寄信 / PM ]
[作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
  1. 1. 網頁基礎複習
  2. 2. 課堂範例
  3. 3. 盒子模型／區塊模型（Box Model）
  4. 4. 作業說明
  5. 5. 上課影音
經過了一個寒假，為了讓大家回復記憶，請先複習基礎的網頁設計概念

1. 網頁基礎複習


[url=http://mepopedia.com/forum/read.php?804,41760][講義] HTML & CSS網頁基礎複習整理[/url]


[hr]

2. 課堂範例


http://mepopedia.com/~web103-2a/hw01/hw01-102


[hr]

3. 盒子模型／區塊模型（Box Model）


.參考以下網址，並牢記下圖 盒子模型／區塊模型（Box Model）
http://mepopedia.com/forum/read.php?844,15917

[img]http://i1136.photobucket.com/albums/n481/parkparkyang/box-moddle-01.gif[/img]

[hr]

4. 作業說明


參照講義
[url=http://mepopedia.com/forum/read.php?804,16481]利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]

自行選擇主題，製作以DIV架構搭配CSS的基本網頁，請注意字體大小、整體質感與配色

可參考http://www.css3maker.com/
適當加入CSS3效果

製作完畢請上傳FTP
下載：http://filezilla-project.org/download.php?type=client

並回覆於此篇文章

1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-102xxxxxxx
2.設計概念與製作心得：
3.何謂HTML、DIV及CSS
4.附上至少一個覺得設計很有質感的網站，並說明原因
5.期待這門課的學習成果與收穫為何?

[hr]
範例：
http://mepopedia.com/~web101-a/hw01/hw01-1006445002/
http://mepopedia.com/~web101-a/hw01/hw01-1006445010/
http://mepopedia.com/forum/read.php?1651,42170

[hr]

5. 上課影音



2015 03 05作業一課堂講解
http://youtu.be/TnaMIVYyf4Y





Edited 3 time(s). Last edit at 03/05/2015 10:46AM by JinJin.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445072 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445072

2.設計概念與製作心得：
冰雪奇緣，有些忘記了 大致上是可以的

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.colingrist.com/
乾淨，看似簡單又很厲害


5.期待這門課的學習成果與收穫為何?
做出更有質感更厲害的網頁



1025445072 王人永



Edited 1 time(s). Last edit at 03/05/2015 10:48AM by 1025445072.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
KUPEIRU [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445069

2.設計概念與製作心得：比較甜美且明亮的顏色來表達

3.何謂HTML、DIV及CSS
HTML:架設網站外皮
DIV:區隔網頁上下分段內容或空間管理
CSS :美化編排設計網頁

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.diehlgroup.com/
我覺得黑白色系的網站都滿常讓人覺得很有質感 而且不會雜亂 網頁也把他的想表達得整理得很好很乾淨

5.期待這門課的學習成果與收穫為何?
希望可以做出更多更不一樣的網站 不一樣的排版



Edited 1 time(s). Last edit at 03/05/2015 10:43AM by KUPEIRU.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
Ying Chon [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計  103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445087

2.設計概念與製作心得：
粉紫色系的網站,不怎麼熟

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://linie.com/


5.期待這門課的學習成果與收穫為何?
做出更特別的網站


1025445087



Edited 2 time(s). Last edit at 03/05/2015 10:54AM by Ying Chon.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
melody830610 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計  1025445075
http://mepopedia.com/~web103-2c/hw01/hw01-1025445075

2.設計概念與製作心得：
很難

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.colingrist.com/
乾淨，看似簡單又很厲害


5.期待這門課的學習成果與收穫為何?
做出更有質感更厲害的網頁



1025445075 李依庭

推薦 / 評論　 分享到Facebook     回應文章 Quote
ruy745 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
http://mepopedia.com/~web103-2c/hw01/hw01-1025445024/
2.設計概念與製作心得：複習
雖然上學期被老師當但這學期努力不讓這門課被當所以很認真的在做網頁
3.何謂HTML、DIV及CSS
一種以標籤的行式,提供網頁內容與結構等樣式的標籤.(div)
css(做出網頁設計的樣式語法)
4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.stussy.com/ 簡潔有力
5.期待這門課的學習成果與收穫為何?希望可以做出有質感的網頁
希望可以做得更好

推薦 / 評論　 分享到Facebook     回應文章 Quote
cici [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445039

2.設計概念與製作心得：麵包店豐富鮮豔的色彩有點不熟練

3.何謂HTML、DIV及CSS
HTML:網頁架構
DIV:建立網頁區塊
CSS :風格設定

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.nhdzoo.jp
和網站的主題內容很符合喜歡這種童趣鮮豔的風格

5.期待這門課的學習成果與收穫為何?
能完成有個人風格的網站


1025445039何佳霖



Edited 1 time(s). Last edit at 03/05/2015 11:12AM by cici.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445090 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445090/
2.設計概念與製作心得： 顏色稍微偏暗一點
3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS 美化網頁的視覺
4.附上至少一個覺得設計很有質感的網站，並說明原因
http://oneleslie.blogspot.tw/
喜歡部落格的感覺
5.期待這門課的學習成果與收穫為何?
希望學到更好的技術 增加自己的實力

1025445090鍾婷玟



Edited 1 time(s). Last edit at 03/12/2015 11:08AM by 1025445090.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
許雅筑 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計  103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445054

2.設計概念與製作心得：
一段時間沒碰有些細節會忘記
用強烈色彩表現跟歌詞內容有關

3.何謂HTML、DIV及CSS
HTML: 網頁架構
DIV:用標籤建立網頁區塊
CSS:設計網頁的視覺性

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.q-pot.jp/shop/
有質感，乾淨簡潔又精緻
日文版與英文版的版面不同 有不一樣的感覺

5.期待這門課的學習成果與收穫為何?
能夠做出更好的網站

1025445054 許雅筑



Edited 1 time(s). Last edit at 03/05/2015 10:53AM by 許雅筑.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
Annie真 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445063

2.設計概念與製作心得： 這次以深色的底來表現 ，展現獨特性，但每次在配色都會花很長的時間

3.何謂HTML、DIV及CSS :
HTML建築網頁架構與設定
Div區分主要頁面為主要的排版架構與建立網頁內的區塊
CSS美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因 :
1. http://www.tutton.co.kr/
( 很像電動遊戲 有趣又可愛 )
2.http://www.bodegasbaigorri.com/
( 很多圖片放大式的排列 卻不失美感 )

5.期待這門課的學習成果與收穫為何?
很期待之後可以做出更有趣又好看的網頁

視傳2C 1025445063 洪筠真



Edited 1 time(s). Last edit at 03/05/2015 11:05AM by Annie真.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
小累 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445153/

2.設計概念與製作心得：
SMOSH，很簡單了解，很清楚明瞭

3.何謂HTML、DIV及CSS

HTML: 網頁架構
DIV :用標籤來建立網頁內的區塊
CSS:美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.smosh.com/
很有個人特色，感覺就會很有趣


5.期待這門課的學習成果與收穫為何?
能夠做出 令人驚訝說怎麼這個厲害的網站



1025445153 廖敏君



Edited 2 time(s). Last edit at 03/05/2015 10:45AM by 小累.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
Natoby [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445048

2.設計概念與製作:淡色清爽的感覺

3.何謂HTML、DIV及CSS：分別是網頁架構，包覆一層一層的區塊，美化功能

4.附上至少一個覺得設計很有質感的網站，並說明原因：http://www.awwwards.com/ultranoir/
感覺很精緻很漂亮

5.期待這門課的學習成果與收穫為何? 希望能學會更多的網頁設計技能

1025445048 林侑慶

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445141 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445141

2.設計概念與製作:淡色清爽的感覺

3.何謂HTML、DIV及CSS：分別是網頁架構，包覆一層一層的區塊，美化功能

4.附上至少一個覺得設計很有質感的網站，並說明原因：http://www.awwwards.com/ultranoir/
感覺很不錯

5.期待這門課的學習成果與收穫為何? 希望能學會更多的網頁設計技能

1025445141 王心仁

推薦 / 評論　 分享到Facebook     回應文章 Quote
黃淯婷 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445060

2.設計概念與製作心得： 粉色系

3.何謂HTML、DIV及CSS：分別是網頁架構，包覆一層一層的區塊，美化功能

4.附上至少一個覺得設計很有質感的網站，並說明原因： http://www.schokolake.com/vacationhouse/main.php
可愛的風格，且背景有一些動畫小插圖

5.期待這門課的學習成果與收穫為何? 希望能學會更多的網頁設計技能

1025445060 黃淯婷

推薦 / 評論　 分享到Facebook     回應文章 Quote
詠月吾熹 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445147

2.設計概念與製作心得：
日劇，因為有做過，還可以很快完成

3.何謂HTML、DIV及CSS

HTML: 網頁架構
DIV :用標籤來建立網頁內的區塊
CSS:美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://lovelive-sif.mobimon.com.tw/
手機遊戲，簡單明瞭知道如何玩


5.期待這門課的學習成果與收穫為何?
要做時需要慢慢吸收老師所教的東西，但完成時很有成就感。

1025445147 張郁

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445111 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445111

2.設計概念與製作心得：
沒有忘記上學期學得東西

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://oohlalove.com.tw/
整體很好看，又有很多小巧思

5.期待這門課的學習成果與收穫為何?
希望可以學到更好的技巧
可以做出很好的網頁



1025445111 莊于萱

推薦 / 評論　 分享到Facebook     回應文章 Quote
CHEN CHICHI [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445015

2.設計概念與製作心得：
利用內容裡的主色調紅色當底色，凸顯中間的內容圖片，變得更獨特不一樣好玩。

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤建立網頁內的區塊
CSS 風格的設定

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://nudeshop.tw/
風格樸素清晰，讓商品更有質感。

5.期待這門課的學習成果與收穫為何?
能製作出比以往更進步的網站。

1025445015 陳曉琪



Edited 1 time(s). Last edit at 03/12/2015 12:24AM by CHEN CHICHI.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445018 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445018

2.設計概念與製作心得：
one direction，大部分的語法都還記得，所以沒什麼問題

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://cloudsovercuba.com/
有很多很棒的效果，而且照片配色很棒

5.期待這門課的學習成果與收穫為何?
希望可以做出更棒的網頁，能更有質感

1025445018 陳怡融

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445009 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445009

2.設計概念與製作心得：
因為有試過一學期所以做起來熟悉多了

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.alexanderwang.com/
很喜歡他的簡約，滑鼠移動圖片也會跟著轉變

5.期待這門課的學習成果與收穫為何?
因為之後又會有更多技巧，希望好好學習

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445009 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445180

2.設計概念與製作心得：
現在比較熟練了也熟悉了許多

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.gnosh.co.uk/
他用手繪的感覺來呈現她的網站，整個網站看起來很生動有趣

5.期待這門課的學習成果與收穫為何?
希望老師教的都能我都吸收起來讓自己可以全部完整的做完


1025445180 謝芷寧

推薦 / 評論　 分享到Facebook     回應文章 Quote
Yuchi [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445123

2.設計概念與製作心得：
有比較熟悉這寫語法。

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://junduffy.co.nz/
喜歡這種簡單的感覺。

5.期待這門課的學習成果與收穫為何?
希望可以練得很熟，把語法記住。



1025445123姚育慈

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445006 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址: http://mepopedia.com/~web103-2c/hw01/hw01-1025445006
2.設計概念與製作心得：
因為很喜歡kitty所以內容適用相關配色~
比較偏粉紫色系的^^

因為上學期有學過一些東西還記得~多少還寫得出來
只是有些還不熟希望更加熟練~


3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.mydesy.com/

喜歡簡單風格設計，簡單又不會太空洞

5.期待這門課的學習成果與收穫為何?

希望可以學到更多的特殊效果~
讓東西更豐富

1025445006
鄭喬薰

推薦 / 評論　 分享到Facebook     回應文章 Quote
欻Hu [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445027/html.html
2.設計概念與製作心得： 有再複習的感覺
3.何謂HTML、DIV及CSS 網頁 架構 設計
4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.kentisburygrange.co.uk/
頁面可調大小 畫面及配色看起來舒適
1025445027

推薦 / 評論　 分享到Facebook     回應文章 Quote
王嬿婷 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445129

2.設計概念與製作心得： 以簡單清爽的顏色為主
3.何謂HTML、DIV及CSS :
HTML建築網頁架構與設定
Div區分主要頁面為主要的排版架構與建立網頁內的區塊
CSS美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因 :
1. http://tokyocorkproject.jp/setting_stores/
簡單而有質感的網站
2.http://venusbed.co.jp
傢俱網站讓人感覺很舒服
5.期待這門課的學習成果與收穫為何?
這學期又學到新的東西

視傳2C 1025445129 王嬿婷

推薦 / 評論　 分享到Facebook     回應文章 Quote
李易達 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445036

2.設計概念與製作心得 : 這學期繼續努力

3.何謂HTML、DIV及CSS :
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因 :
http://30000fps.com/ 這網站簡潔有力

5.期待這門課的學習成果與收穫為何?
希望繼續做的更好，把語法弄得更完整

1025445036 李易達

推薦 / 評論　 分享到Facebook     回應文章 Quote
筱 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445102

2.設計概念與製作心得：明亮乾淨的感覺來表現，與上學期的差不多所以還可以。

3.何謂HTML、DIV及CSS
HTML:架設網站外皮
DIV:區隔網頁上下分段內容或空間管理
CSS :美化編排設計網頁

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.85cafe.com/index.php

我覺得他們的網頁簡潔讓人好找所要的項目，配色簡單但很好看。

5.期待這門課的學習成果與收穫為何?

可以比上學期的課所做的網頁更漂亮更有質感，學會更多東西。

1025445102 邱筱惠

推薦 / 評論　 分享到Facebook     回應文章 Quote
XuanSong [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445126

2.設計概念與製作心得：
複習之前的

3.何謂HTML、DIV及CSS

HTML架構
DIV建立區塊
CSS美化

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www5a.biglobe.ne.jp/~balls/
簡單明瞭

5.期待這門課的學習成果與收穫為何?
希望可以學到更多更特殊的



1025445126宋映萱

推薦 / 評論　 分享到Facebook     回應文章 Quote
王嬿婷 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445045

2.設計概念與製作心得： 以簡單藍顏色為主
3.何謂HTML、DIV及CSS :
HTML建築網頁架構與設定
Div區分主要頁面為主要的排版架構與建立網頁內的區塊
CSS美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因 :
1. http://www.stunden.org/category/portfolios/
簡單而插畫的網站
2.http://www.etude.co.kr/liquidlips/web/index.jsp
韓國美妝設計很有創意
5.期待這門課的學習成果與收穫為何?
這學期又學到新的東西

視傳2C 1025445045 饒文欣

推薦 / 評論　 分享到Facebook     回應文章 Quote
陸怡潔 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445162/
2.設計概念與製作心得：暖色調
3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS 美化網頁的視覺
4.附上至少一個覺得設計很有質感的網站，並說明原因
http://brotheronlyxweb.com/
簡潔有設計感
5.期待這門課的學習成果與收穫為何?
希望可以學到更多以前沒學的東西

1025445162陸怡潔



Edited 1 time(s). Last edit at 03/12/2015 02:06AM by 陸怡潔.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
XuanSong [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445051

2.設計概念與製作心得：
簡單明瞭'

3.何謂HTML、DIV及CSS

HTML: 網頁架構
DIV :用標籤來建立網頁內的區塊
CSS:美化網頁，風格設定，塑造美感

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://beta.rallyinteractive.com/
非常乾淨明瞭


5.期待這門課的學習成果與收穫為何?
上課要專心 學到很多

1025445051 林芳予

推薦 / 評論　 分享到Facebook     回應文章 Quote
張曉萱 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445150

2.設計概念與製作心得：照主題形象配置色彩

3.何謂HTML、DIV及CSS
HTML:架設網站外皮
DIV:區隔網頁上下分段內容或空間管理
CSS :美化編排設計網頁

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.sanrio.com.tw/Characters/Characters.aspx
這個網站很可愛還有特殊的效果

5.期待這門課的學習成果與收穫為何?
比以前進步並學到習用的技巧


150

推薦 / 評論　 分享到Facebook     回應文章 Quote
邊緣人 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445138

2.設計概念與製作心得：覺得要自己建一套HTML會比較漂亮smiling smiley)

3.何謂HTML、DIV及CSS？
HTML─網頁架構
DIV─標籤用以管理區塊
CSS─網頁的著色板，用以美畫網頁架構的裝飾及設計

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://infoplat.me/recruit/ (NTU InfoPlat 臺大學生資訊平台)
大塊面積的自由版面，簡單乾淨且俐落。

5.期待這門課的學習成果與收穫為何?
學好，並找到實習工作，更加往前一步。

1025445138 梁奕堯



Edited 2 time(s). Last edit at 03/12/2015 03:15AM by 邊緣人.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
yaman [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445132

2.設計概念與製作心得：
和上學期做的很像 沒有忘記

3.何謂HTML、DIV及CSS
HTML 網頁架構 DIV 用標籤來建立網頁內的區塊 CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
https://bears-school.com/english/picturebook.html
風格簡單 配色樸素

5.期待這門課的學習成果與收穫為何?
希望能做出更棒的網頁

推薦 / 評論　 分享到Facebook     回應文章 Quote
陳姿璇 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445183

2.設計概念與製作心得：用天竺鼠來試試看做網頁


3.何謂HTML、DIV及CSS
HTML: 網頁架構
DIV :建立網頁內的區塊
CSS:美化網頁

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.designer.org.tw/
覺得使用上蠻方便的.看起來也不會很雜亂



5.期待這門課的學習成果與收穫為何?
能夠做出屬於自己作品的網頁

1025445183 陳姿璇



Edited 2 time(s). Last edit at 03/12/2015 12:11PM by 陳姿璇.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445030 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445030
2.設計概念與製作心得： 顏色偏自由奔放的感覺
3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS 美化網頁的視覺
4.附上至少一個覺得設計很有質感的網站，並說明原因
http://cartoons.redbull.com/tw-zh/archive/
喜歡這種偏有互動性的網站
5.期待這門課的學習成果與收穫為何?
希望學到更好的專業，精實自己

1025445030王泰然

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445120 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445120

2.設計概念與製作心得：
草莓～有點忘記但看一看就恢復記憶了
3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS 網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.ecute.co.jp/tokyonohatakekara/
簡單乾淨可愛又不失設計感很多小巧思


5.期待這門課的學習成果與收穫為何?
做出很有質感的網頁

推薦 / 評論　 分享到Facebook     回應文章 Quote
綠辛 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445117

2.設計概念與製作心得：
用我的愛的 "蠟筆小新"
藍紫色白色調 來呈現簡明瞭的風格
還有小小的特色 是線條(還可以再發揮得更好)

會遇到一些小問題 還好最後有解決了哈哈

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
(1)
http://www.pazzo.com.tw/

白底黑字 加了一些動態圖 靜態圖 讓我感到清爽舒適
而且這家衣服我有買過 超好穿的 質感又好

(2)
http://adlibfashion.com/
有我喜歡的藍綠色調的字體顏色
搭配了灰字 白底 清爽的圖
簡單風 真的很喜歡

5.期待這門課的學習成果與收穫為何?
真的要好好地學
要做出好的網頁
其實不會太難
只要花些時間
就可以的


‘’ˇˊˋ˙′″

1025445117 黃振誠

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025443044 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025443044

2.設計概念與製作心得：
有點忘了怎麼做

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS 美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.amici.com.tw/home.asp
很有它的特色

5.期待這門課的學習成果與收穫為何?
學到如何架設更完整的網站


1025443044 王薏茹

推薦 / 評論　 分享到Facebook     回應文章 Quote
黃婷萱 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計  1025445192  黃婷萱
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445192

2.設計概念與製作心得： 介紹音樂人 李榮浩 / 目前沒有遇到什麼困難

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://springsummer.dk/#/spring-summer
很有設計感的一個網站 ，視覺上不會讓人感到凌亂 難閱讀 !

5.期待這門課的學習成果與收穫為何?

能夠 獨立 完成 一個有設計感的網業作品 !

1025445192 黃婷萱

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445081 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計  103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445081/

2.設計概念與製作心得：
設計概念是吉他 很不會這種東西 雖然看起來很簡單 但我做很久

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.gtp.tw/index.php
簡單的配色 可是不失設計感


5.期待這門課的學習成果與收穫為何?
可以學習新的領域 目前需要多多嘗試練習



1025445081 林禹丞

推薦 / 評論　 分享到Facebook     回應文章 Quote
砂兒 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445165

2.設計概念與製作心得：
日本樂團[Alexandros]團員簡介
有些部分忘記怎麼調整

3.何謂HTML、DIV及CSS

HTML→網頁架構
DIV →用標籤來建立網頁內的區塊
CSS→美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://nipponcolors.com/
展現日本傳統色的美


5.期待這門課的學習成果與收穫為何?
能夠做出更美的網站

1025445165 陳文晴

推薦 / 評論　 分享到Facebook     回應文章 Quote
fanny40721 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445156

2.設計概念與製作心得：
灰藍色色調，營造質感。

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤建立網頁內的區塊
CSS 風格的設定

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://coffeemegane.com/
風格簡潔有質感。

5.期待這門課的學習成果與收穫為何?
能比以前更加進步。

1025445156 蔡佳芬

推薦 / 評論　 分享到Facebook     回應文章 Quote
艾希 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445135
2.設計概念與製作心得：水藍色搭配

3.何謂HTML、DIV及CSS
HTML:網站架構
DIV:區隔網頁上下分段內容或空間管理
CSS :美化編排設計網頁

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://brenda-suitcase.weebly.com/
網站不會過於花俏 只是使用簡單的白底

5.期待這門課的學習成果與收穫為何?
學到很多

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445198 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445198

2.設計概念與製作心得：我對配色的敏感度不高

3.何謂HTML、DIV及CSS
HTML:網頁架構
DIV:建立網頁區塊
CSS :風格設定

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://www.ted.com/
和網站的主題內容很符合喜歡這種童趣鮮豔的風格

5.期待這門課的學習成果與收穫為何?
把該學的學一學


1025445198謝秉宇



Edited 1 time(s). Last edit at 06/12/2015 05:32PM by 1025445198.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445096 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
.網址:http://mepopedia.com/~web103-2c/hw01/hw01-1025445096

設計概念與製作心得：喜歡
何謂HTML、DIV及CSS
HTML:網頁架構
DIV:建立網頁區塊
CSS :風格設定

期待這門課的學習成果與收穫為何? 希望能更進步！

1025445096 徐琬凌

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445177 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445177

2.設計概念與製作心得：
我愛小美人魚 因為喜歡 用小美人魚的顏色

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因
http://disney.lovesakura.com/Text/c28.htm
喜歡


5.期待這門課的學習成果與收穫為何?
不太認真 要多多加油 努力



1025445177 吳永婷



Edited 1 time(s). Last edit at 06/13/2015 05:36PM by 1025445177.
(編輯記錄)

推薦 / 評論　 分享到Facebook     回應文章 Quote
綠辛 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
1.http://mepopedia.com/~web103-2c/hw01/hw01-1025445042

2.設計概念與製作心得：
天空之城，忘記了一些 不過還行

3.何謂HTML、DIV及CSS

HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站，並說明原因



5.期待這門課的學習成果與收穫為何?
有些難 在於架構方面....



1025445042 逄堡鈞

推薦 / 評論　 分享到Facebook     回應文章 Quote
1025445195 [ 站內寄信 / PM ]
Re: [作業01] DIV與CSS複習 --以色塊為主的基本單欄網頁版型

分類標籤: 103-2《中國》竹視傳二C-進階網頁設計
(1)作業網址：http://mepopedia.com/~web103-2c/midterm/midterm-1025445195
(2)網站主題： H&M
(3)導覽列： 首頁 新裝 STYLE 店面 外部連結
(2)對象：女性消費者
(3)色彩計畫： 紅白撞色
(4)風格設定、預期成效： 時尚
(5)製作心得：很難

1025445195古馥瑜

推薦 / 評論　 分享到Facebook     回應文章 Quote
Newer Topic Older Topic