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

Advanced

Re: [作業03] HTML與CSS練習-內頁實作篇--資料整理--以DIV製作表格效果

1. HTML與CSS練習--內頁實作篇--資料整理--以DIV製作表格效果作業說明


請參考
[講義] HTML與CSS練習--內頁實作篇--資料整理--以DIV製作表格效果:
http://mepopedia.com/forum/read.php?804,44612

[hr]

1. 作業說明

1.延續作業02,繼續完成至少另一頁,
2.製作:(1)完成首頁,(2)設定滑鼠移過的效果,其他頁面將陸續完成。(3)適當加入CSS3的效果

[hr]

2. 作業步驟

1.參考http://mepopedia.com/~jinjin/web/hw04a/works.html
並以講義中的語法為參考http://mepopedia.com/forum/read.php?804,44612
2.延續作業02的內容
3.請以設計質感與創新設計為主要考量
4.將HTML與CSS語法分別貼上後,修改HTML與CSS語法。
5.將資料夾命名為 hw03-學號,以FTP上傳至hw03資料夾
作業網址為http://mepopedia.com/~css104-2b/hw03/hw03-1035445XXX/works.html (此檔名可自行設定)

並請回覆:

(1)作業網址:
(2)本頁設計重點:
(3)製作心得:
學號

[hr]
請於規定時間準時繳交作業,逾期不後。
[hr]

(1)作業網址: [url=http://mepopedia.com/~css104-2b/hw03/hw03-1035445176/wind.html]http://mepopedia.com/~css104-2b/hw03/hw03-1035445176/wind.html[/url]
(2)本頁設計重點: 一樣以藍色調為主 介紹故事大綱
(3)製作心得: 很順手~~~

學號 1035445176

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445104/food.html
(2)本頁設計重點: 介紹俄羅斯傳統美食
(3)製作心得: 越來越熟悉網頁架構了

1035445104李恩慈

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445152/differentiate.html
(2)本頁設計重點: 如何分辨好的法國麵包
(3)製作心得: 希望可以學到更多css效果

1035445152

1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445158/youth.html
(2)本頁設計重點:介紹台灣花季與花的象徵意義。
(3)製作心得: 這次用不同的方式製作網頁的表格,之前是用table現在是用div,學到了另外一種做表格的技巧,原來同一種東西,也可以用不同的語法呈現。
學號:1035445158

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445131/about.html
(2)本頁設計重點:以單調為主,介紹咖啡豆的種類
(3)製作心得: 越來越熟悉網頁設計了,感覺比上次簡單

1035445131

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445041/music.html
(2)本頁設計重點: 一樣樂團
(3)製作心得: 越來越熟悉網頁架構了

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445209/restaurant.html
(2)本頁設計重點: 義大利的美食餐廳類別
(3)製作心得: 希望能學到更多語法

1035445209 林冠妤

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445113/about.html
(2)本頁設計重點: 人物介紹
(3)製作心得: 我快瘋了,中間內文縮不回來阿
學號:1035445113

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445200/base.html
(2)本頁設計重點: 一樣~介紹手帳
(3)製作心得: 希望能夠學到更多的語法以及網頁的架構

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445053/about.html
(2)本頁設計重點: 常見服裝介紹
(3)製作心得: 比首頁來的簡單,一目了然
學號:1035445053

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445086/about.html
(2)本頁設計重點:以簡單清晰的墨綠色系為主,介紹穿搭職人每天的搭配
(3)製作心得: 還可以

學號 1035445086

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445155/about.html
(2)本頁設計重點:以簡單清晰的的風格,說明製作
(3)製作心得: 還可以

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445059/about.html
(2)本頁設計重點:簡單 藍色系
(3)製作心得: 好累喔

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445170/index2.html
(2)本頁設計重點:遊戲職業介紹目前先做一篇初心者的,後續會再慢慢做小分頁
(3)製作心得: 其實做到一半有混亂到QAQ 還好有慢慢調回來。只是不懂為什麼原本在後面的背景變成在框框裡了???

1035445170

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445002
(2)本頁設計重點:柴犬種類的分類
(3)製作心得:比表格好用多了
學號 :1035445002

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1025445186/works.html
(2)本頁設計重點:簡單 深藍色系
(3)製作心得: 慢慢的摸索出些東西


視傳3C 1025445186 彭韋豪

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1025445234/born.html
(2)本頁設計重點:
(3)製作心得: 連結上出了點問題,最後花較多時間在修改
學號 1025445234

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035461133/haracter.html
(2)本頁設計重點: 以巧達的紫色為主的配色,介紹人物。
(3)製作心得: 比上次的簡單很多了,覺得這次快多了。
學號 1035461133

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445026/about.html
(2)本頁設計重點:圖片的色調調整與背景一致 想呈現淡雅的感覺
(3)製作心得:看完教學影片在做比較清楚
學號1035445026

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445218/fish.html
(2)本頁設計重點: 介紹海底總動員整系列的角色
(3)製作心得: 因為想使用比較淡的顏色,所以使用了透明度,但不管如何顏色都很難調。

1035445218 柯惠文

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445068/about.html
(2)本頁設計重點: 介紹企鵝家族人物
(3)製作心得: 還可以

學號:1035445068



Edited 1 time(s). Last edit at 03/21/2016 09:28PM by _SHUAN.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445191
(2)本頁設計重點: 介紹幾米的作品,希望標示清楚又不會很單調
(3)製作心得: 有比上個熟練一點了,能夠找出是哪個div並且調出自己要的樣子

1035445191 翁瑱真



Edited 1 time(s). Last edit at 03/21/2016 08:21PM by 翁瑱真.
(編輯記錄)

1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445098/page2.html
(2)本頁設計重點:介紹宮崎駿各部動畫
(3)製作心得: 感覺越做越順手,能變的樣式也變得很多,很有趣。
學號:1035445098



Edited 3 time(s). Last edit at 03/21/2016 10:53PM by 1035445098.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445011/about.html
(2)本頁設計重點:介紹貓的報恩裡的角色
(3)製作心得: 上次真的比較麻煩,不過也越來越上手了

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445149/Brand%20introduction.html
(2)本頁設計重點: 介紹ONLY這個牌子的由來
(3)製作心得: 有越來越上手的感覺,也能做出自己想要的版面

1035445149 詹前緯



Edited 1 time(s). Last edit at 03/22/2016 12:02AM by 1035445149.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445194/about.html
(2)本頁設計重點: 團員的介紹
(3)製作心得: 這次比較容易
學號 1035445194

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445071/character.html
(2)本頁設計重點:人物介紹
(3)製作心得:這樣分隔讓人看了清楚明瞭
學號 1035445071

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445107/about.html
(2)本頁設計重點: 好萊塢的歷史
(3)製作心得: 搞得有點亂
1035445107



Edited 1 time(s). Last edit at 03/22/2016 03:38PM by ttn0910.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445137/about.html
(2)本頁設計重點:以簡約的的風格來說明製作
(3)製作心得: 還可以

1035445137 周李銘

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445032/works.html
(2)本頁設計重點:介紹Nicolas Monterrat幾個系列作品。
(3)製作心得:做很多連結做完還蠻開心的,又學到不一樣的語法。

1035445032



Edited 2 time(s). Last edit at 03/22/2016 05:22AM by yii_.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445065/about.html
(2)本頁設計重點: 故事的每一張圖,加小說明,背景更改成紅色系/網頁連接有偷懶也是圖片到時再想能貼怎樣網頁
點開圖片是修改過後的非常鮮艷
(3)製作心得:
學號 1035445065

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445206/profile.html
(2)本頁設計重點: 介紹番茄的品種
(3)製作心得: 越來越熟悉網頁的架構了

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445074/work.html
(2)本頁設計重點: 介紹抽象派畫家
(3)製作心得:
我重作也改主題了 之前是做咖啡 覺得布店 後來 挑我喜歡的 抽象派 來製作
覺得好費工夫 真的 會死好幾個腦細胞



Edited 1 time(s). Last edit at 03/23/2016 06:10PM by 1035445074.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445014/about.html

(2)本頁設計重點:用簡單的冷色調,呈現一種泉氣息

(3)製作心得: 越來越熟練了

1035445014

1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445134/blog.html
(2)本頁設計重點:介紹欧美时尚博主IG穿搭日常
(3)製作心得: 之前制作表格是用table現在是用div,多学会了另外一种方法,将制作表格的基本功扎实运用
學號:1035445134

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445125/about
(2)本頁設計重點: 介紹蛋黃哥展覽
(3)製作心得: 覺得有些進步

1035445125彭詩婷

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445125/about.html
(2)本業設計重點: 介紹蛋黃哥展覽
(3)製作心得: 搞不懂怎麼連結另一個頁面

1035445125彭詩婷



Edited 2 time(s). Last edit at 03/29/2016 04:13PM by 1035445125.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1025445118/about.html

(3)製作心得: 搞不懂怎麼連結另一個頁面

1025445118



Edited 1 time(s). Last edit at 04/19/2016 03:17PM by 1035445017.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1025445032/about.html
(2)本頁設計重點:重機金屬感
(3)製作心得: 越來越了解

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445044/about.html
(2)本頁設計重點:臘腸狗種類介紹
(3)製作心得:還是不太熟練,要再加強

學號 1035445044



Edited 1 time(s). Last edit at 04/09/2016 05:34PM by 1035445044.
(編輯記錄)

1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445047/about.html
(2)本頁設計重點:宮崎駿介紹
(3)製作心得:還有很多須待加強的地方,不懂的地方也有問同學

學號 1035445047




Edited 1 time(s). Last edit at 04/09/2016 05:34PM by 1035445047



Edited 1 time(s). Last edit at 04/10/2016 12:53PM by 1035445047.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css104-2b/midterm/midterm-1035445224/
(2)本頁設計重點: 介紹無印良品
(3)製作心得: 越來越熟悉網頁架構了



Edited 1 time(s). Last edit at 04/13/2016 05:48PM by 1035445224.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445185
(2)本頁設計重點: 抹茶紅豆白玉的製作過程
(3)製作心得: 覺得網頁設計越來越難,但是能學到很多東西



Edited 1 time(s). Last edit at 04/13/2016 05:53PM by 1035445185 徐于庭.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445029
(2)本頁設計重點: 介紹渡邊直美
(3)製作心得:覺得又學到了新東西



Edited 1 time(s). Last edit at 04/15/2016 01:44AM by 1035445029.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445023/about.html
(2)本頁設計重點: 介紹米老鼠的各種情報
(3)製作心得: 感覺比首頁好製作
學號 1035445023

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445080/profile.html
(2)本頁設計重點:一樣以藍色與黑色為主 介紹哈士奇
(3)製作心得:感覺還要再加油~
學號 1035445080

回錯



Edited 1 time(s). Last edit at 04/18/2016 09:52AM by 1035445217.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445005/index.html
(2)本頁設計重點:做出極簡的感覺 簡單的配色
(3)製作心得: 慢慢的用出一些東西....

學號 1035445005

(1)作業網址: [url=http://mepopedia.com/~css104-2b/hw03/hw03-1035445017/p02.html]http://mepopedia.com/~css104-2b/hw03/hw03-1035445017/p02.html[/url]
(2)本頁設計重點: 介紹人物
(3)製作心得: 還可以

學號 1035445017

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445119/index.html
(2)本頁設計重點:簡約的風格,沒有太多顏色
(3)製作心得: 慢慢做出自己想要的感覺

學號 1035445119

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445222/group.html
(2)本頁設計重點: 以藍灰色調介紹成團經歷
(3)製作心得: 搭配老師的影片教學操作過程很順利

學號 1035445222

(1)作業網址: file:///C:/Users/User/Desktop/hw1035445182/index.html
(2)本頁設計重點: VDL
(3)製作心得: 老師你好 非常抱歉 因個人因素沒有準時上課及繳交作業 為來得及在周末前繳交期中作業 直接將整個網頁製作完畢並繳交到各個平時作業 希望老師能體諒並且給予評分機會 真的非常抱歉
視傳2B 1035445182

ps. 作業01和02都有做回應 但網址是錯的 此篇回覆已經修改成正確網址 煩請老師過目

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445050/index1/index-1.html
(2)本頁設計重點:DEEMO遊戲角色介紹
(3)製作心得:我覺ㄉ我弄得頗美ˊWˋ♥

(1)作業網址:http://mepopedia.com/~css104-2b/hw03/hw03-1035445179
(2)本頁設計重點:介紹日本的各種文化特色等
(3)製作心得:開始慢慢習慣網頁架構了

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445056/about.html
(2)本頁設計重點:介紹遊戲故事背景
(3)製作心得: 比起上次還要簡單許多。

(1)作業網址: http://mepopedia.com/~css104-2b/hw03/hw03-1035445077/
(2)本頁設計重點:以黑白為重點配色
(3)製作心得: 很ok

學號 1035445077



Edited 1 time(s). Last edit at 06/17/2016 02:47PM by 吳寶蓉.
(編輯記錄)