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

Advanced

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

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


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



1. 作業說明

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



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/~web103-2b/hw03/hw03-1025445XXX/works.html (此檔名可自行設定)


並請回覆:

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



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





Edited 1 time(s). Last edit at 04/02/2015 09:11AM by JinJin.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445062
(2)本頁設計重點: 顏色還是以 都以提拉米蘇的色系,在介紹TIRAMISU 的每個口味
(3)製作心得:
一直找不到為何換這頁時,footer就變短?還有明明沒動東西可是contents就是高低不一樣
學號 1025445062



Edited 2 time(s). Last edit at 04/01/2015 09:48PM by julie1025445062.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445155/
(2)本頁設計重點: 還是以蓋酷家族為主軸,介紹他們的一切
(3)製作心得:我覺得越來越順利
學號 1025445155

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445005
(2)本頁設計重點:
只運用這次作業的板塊設計,在"實作影片"分頁部分,為了力求頁面功能性,秉棄原有的編排及說明文,讓畫面更乾淨簡潔。
(3)製作心得:
做完更餓了...

學號 1025445005

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445065
(2)本頁設計重點: 顏色以黃色為主,背景以簡單不花俏做設計!
(3)製作心得:可以直接從語法了解相對位置,比起之前更容易懂做網頁了!!

學號 1025445065

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445182/
(2)本頁設計重點: 按照這次練習的表格區塊設定,並每頁都用不同色調去呈現。
(3)製作心得: 比想像中還複雜....但是對於更改CSS更熟練

學號 1025445182

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445226
(2)本頁設計重點: 介紹老佛爺最近的作品
(3)製作心得:
其實也沒有想象中那麼難~
學號 1025445226

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445029
(2)本頁設計重點:
製作分業,調整顏色及編排。hot smiley
(3)製作心得:
覺得不夠熟,該多玩語法。>grinning smiley<

學號 1025445029

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445056
(2)本頁設計重點:保持前次作業的風格, 並按照這次練習的表格區塊設定每頁的內容及版面。
(3)製作心得:碰到清明連假沒做幾天就會遺忘一些程式設定.....以後要好好做筆記。

學號 1025445056

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445170
(2)本頁設計重點: 仔細介紹馬卡龍
(3)製作心得:慢慢的了解版面設定的應用

學號 1025445170

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445140/race.html
(2)本頁設計重點: 介紹貓奴們台灣常見的家貓種類
(3)製作心得: 在做這個網頁時看到這些可愛的貓咪們就覺得心花怒放,希望可以透過這個網頁來介紹貓咪 ,並希望養寵物的人們可以不要隨便的棄養寵物。
學號 1025445140

1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445002
(2)本頁設計重點:中華一番人物介紹
製作分業,調整顏色及編排。
(3)製作心得
很不熟哈哈哈哈
學號 1025445002

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445128
(2)本頁設計重點: 一樣以黑白紅系列為主,營造犯罪現幹練的氣氛。
(3)製作心得:覺得依語法一一去分別各個位置讓人更容易懂得網頁。

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw02-1025445035/
(2)本頁設計重點: 列表式介紹
(3)製作心得: 圖片跟文字一直喬不好
學號 1025445035

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445083
(2)本頁設計重點:
乾淨整潔 言簡意賅介紹
(3)製作心得:
好複雜~~~~

學號 1025445083

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445008
(2)本頁設計重點: 活潑
(3)製作心得: 好
學號 :1025445008

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445080/about.html
(2)本頁設計重點: 繼續上次的風格繼續改一些樣式內容
(3)製作心得: bg_contents有時候會太短以至於要看網頁長度改背景長度

學號 1025445080



Edited 1 time(s). Last edit at 04/08/2015 12:07PM by wenhui06.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445044
(2)本頁設計重點: 跟上次的重點一樣 用溫暖的暖色系
(3)製作心得: 這次作業有點小小困難
學號 1025445044



Edited 1 time(s). Last edit at 04/08/2015 12:08PM by 李雅涵.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445167/work.html
(2)本頁設計重點: 介紹家貓
(3)製作心得: 很多東西跑掉,今天解決囉XD
學號 1025445167



Edited 1 time(s). Last edit at 04/08/2015 12:08PM by 1025445167.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445092/work.html
(2)本頁設計重點: 欣賞更多好作品以及網址,都會讓我們有更多創作想法。
(3)製作心得: 多多研究就會更多不一樣的效果。
學號 1025445092

(1)作業網址:
http://mepopedia.com/~web103-2b/hw03/hw03-1025445014/draw.html
(2)本頁設計重點:
依舊是以作者的畫作主題為主,以點點為重點,簡單素面為配色。
(3)製作心得:
css語法位置總是找了很久,但慢慢開始有抓到一些訣竅。

學號 1025445014



Edited 1 time(s). Last edit at 04/15/2015 12:09PM by penny1114.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445197
(2)本頁設計重點: 以日式大福為主製作的內容頁
(3)製作心得: 導覽列效果出不來 連結上主頁時設計的部分出不來
學號1025445197

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445197
(2)本頁設計重點: 以日式大福為主的內容頁
(3)製作心得: 導覽列效果出不來連結時設計會跑掉

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445134
(2)本頁設計重點: 新增加對於作者的基礎介紹及作者過去作品
(3)製作心得: 我還是有蠻多地方靠自己摸索不了 像css3我都不知道該放哪裡 我覺得我問題很多 sad smiley
學號 1025445134



Edited 11 time(s). Last edit at 04/13/2015 08:30PM by 1025445134.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025448040
(2)本頁設計重點: 介紹藍莓塔的製作步驟
(3)製作心得:
要很有耐心一直丟圖片
學號 1025448040

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445125
(2)本頁設計重點: 介紹哆啦A夢曾經出版過的幾個商品
(3)製作心得: 慢慢上手囉~
學號 1025445125

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445041
(2)本頁設計重點:介紹迪士尼奇奇蒂蒂的簡介
(3)製作心得:會有一些還不太懂的地方,放照片會有小問題
學號1025445041



Edited 1 time(s). Last edit at 04/15/2015 10:37AM by 1025445041.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web103-2b/hw02/hw02-1025445143
(2)本頁設計重點:將銀飾分類簡單介紹
(3)製作心得:學習了更多網頁製作的技巧

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445224
(2)本頁設計重點:介紹金契妍設計的房子,舒適溫馨的感覺。
(3)製作心得:跟著老師的教學影片做有一點一點在進步,雖然自己學習得很慢,但是做完很有成就感。
學號1025445224



Edited 2 time(s). Last edit at 04/15/2015 11:04AM by 1025445224.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445131/about.html
(2)本頁設計重點:主要是以復古風的感覺去呈現,顏色也是以淺綠為主
(3)製作心得:比較知道該怎麼做了,只是語法還是看不太懂
學號: 1025445131

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445071
(2)本頁設計重點:介紹第一天的行程。
(3)製作心得:覺得遇到了一些自己無法解決的問題,漸漸感覺到了困難。
學號 1025445071



Edited 1 time(s). Last edit at 04/15/2015 12:22PM by 1025445071.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445225/Taste.html
(2)本頁設計重點:介紹商品的口味搭配黃色塊背景
(3)製作心得:背景圖片跟頁尾的色塊上傳之後看不見...
學號 1025445225

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445176
(2)本頁設計重點: 顏色以藍色為主,背景以簡單做設計!
(3)製作心得:可以直接從語法了解相對位置,比起之前更容易懂了!

學號 1025445176

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025435227/about.html
(2)本頁設計重點:介紹成員
(3)製作心得:難但是還是要做
1025435227

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445050
(2)本頁設計重點: 介紹
(3)製作心得: 改的時候有點亂哈哈

學號 1025445050

(1)作業網址: http://mepopedia.com/~web103-2b/midterm/midterm-1025445011
(2)本頁設計重點: 顏色
(3)製作心得: eye popping smileyeye popping smileyeye popping smileyeye popping smileyeye popping smiley
學號 1025445011

(1)作業網址:http://mepopedia.com/~web103-2b/midterm/midterm-1025445023/AS.html
(2)本頁設計重點: 角色介紹
(3)製作心得:這頁比較好懂哈哈smiling bouncing smiley

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445020/P2.html
(2)本頁設計重點: 以簡單的方格將童話之森精彩章節取下
(3)製作心得: 網頁越來越上手了~~
學號 1025445020

(1)作業網址: http://mepopedia.com/~web103-2b/midterm/midterm-1025445047/
(2)本頁設計重點: 歷史&過程
(3)製作心得: 做自己喜歡的主題,完成了會超開心
學號 1025445047

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445086
(2)本頁設計重點: 色彩搭配以及圖文並茂
(3)製作心得:
雖然有時候還是搞不太懂,但重新看老師的教學影片,就能大概搞懂
學號 1025445086

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445113/
(2)本頁設計重點:介紹作者作品
(3)製作心得:一直調不好自己想要的,不過最後還是用好了
學號 1025445113

(1)作業網址:
http://mepopedia.com/~web103-2b/hw03/hw03-1025435233
(2)本頁設計重點:
是以韓國團體主題為主,以藍色為重點,搭配簡單素色的搭配版面。
(3)製作心得:
開始有點可以很上手的做作業了,不會煩躁了!!!

學號 102435233



Edited 1 time(s). Last edit at 04/22/2015 11:27AM by 1025435233.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web103-2b/hw03/hw03-1025445164/
(2)本頁設計重點:
不同的產品介紹,以簡單的風格為主
(3)製作心得:
做到一半,遇到很多問題,快瘋了~

(1)作業網址:http://mepopedia.com/~web103-2b/midterm/midterm-1025445026
(2)網站主題:Hippo Hippo
(3)導覽列:河馬近親 河馬照片 河馬分布 河馬習性 河馬影片連結
(2)對象 :任何對荷馬有興趣的人
(3)色彩計畫: 河馬類似配色
(4)風格設定、網頁看點、預期成效:簡潔,河馬色
(5)製作心得:還是很多沒有做的完全的地方,因為自己還不是很熟悉,有些地方會跑掉橋很久還用不回來,希望以後可以進步,也可以設計出更有感覺的網頁。

學號 1025445026

1025445077 儲徳君


(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw-1025445077-03/works.html
(2)本頁設計重點: 完成其他頁
(3)製作心得: 很有成就感

(1)作業網址:http://mepopedia.com/~web103-2b/midterm/midterm-1025445089/
(2)本頁設計重點:介紹服裝品牌
(3)製作心得:一直調不好自己想要的,不過最後還是用好了
學號 1025445089

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445200/works.html
(2)本頁設計重點: 直營店
(3)製作心得: 愛吃巧克力
學號 1025445200

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1025445152/
(2)本頁設計重點: 簡單易懂
(3)製作心得: 我沒看到要重新回復
學號 1025445152

(1)作業網址: http://mepopedia.com/~web103-2b/hw03/hw03-1015445250
(2)本頁設計重點: 分隔區塊作介紹
(3)製作心得: OK
學號 1015445250



Edited 1 time(s). Last edit at 07/05/2015 04:49PM by sena5555.
(編輯記錄)