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

Advanced

Re: [作業08] 雙欄垂直導覽列製作

[作業08] 雙欄垂直導覽列製作

請延續 [作業07] 以Float:浮動,製作雙欄網頁
或者直接以期末做為開始製作

參考[color=#CC3300][講義07] 以Float:浮動,製作雙欄網頁
http://mepopedia.com/forum/read.php?804,18255[/color]


[color=#CC0066]本講義範例網址
http://mepopedia.com/~jinjin/web/hw07/[/color]


的步驟製作,將垂直導覽列設定的部分製作完成。

[color=#CC0099]可以連結到不同頁面或外部連結,也可以如範例以錨點連結至同一頁面。[/color]


[hr]

1. 二、繳交作業方式



[color=#CC0099]若作業七已經全部完成,則貼上作業七網址即可[/color]

1.製作完成後,檔案命名方式:

[color=#669900]第八個平時作業FTP上的資料夾為:hw08

每位同學請將自己的資料夾命名為:hw08-學號
這個作業的網址則為:http://mepopedia.com/~web100a/hw08/hw08-100xxxxxxx

資料夾內含:
1.首頁命名為index.html
2.一個命名為style.css的css樣式檔
3.images圖檔資料夾

存放在 < hw08-學號 > 的資夾內[/color]


2.上傳至FTP

3.回覆本篇文章

(1).作業網址 :

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:
2.有無遇到的問題?
3.製作感想
4.製作作業的時間


[color=#CC0099]請務必在下次上課前回覆,否則為遲交[/color]





Edited 2 time(s). Last edit at 12/07/2011 01:30AM by HP.
(編輯記錄)

Attachments:
開啟 | 下載 - hw08-ex.rar (149.3 KB)
(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445096

P.S-作業07製作完畢。所以算作業08了。

(2).請回答以下問題:
1.網頁主題:皮克斯動畫工作室
配色與風格設定:未來感深藍色系
2.有無遇到的問題? 雙欄感覺還是有點疑惑,不過現在應該沒太大問題。
3.製作感想 好難,好難,好難。可是我會盡力去做。 今天聽了講解之後好像簡單多了... smiling smiley
4.製作作業的時間 上次做完。(4天)

MEPOERs said:
JinJin: 看起來沒問題,繼續加油囉!
(1).作業網址 :http://mepopedia.com/~web100a/hw08/hw08-1001445019



(2).請回答以下問題:
1.網頁主題:SNOOPY
配色與風格設定:簡潔
2.有無遇到的問題: 沒有
3.製作感想:這次有些東西比較難懂,但是還OK
4.製作作業的時間:2-3小時



Edited 1 time(s). Last edit at 12/13/2011 09:17PM by SAIN.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445092

(2).請回答以下問題:
1.網頁主題:五月天 / 配色與風格設定:灰藍簡約風
2.有無遇到的問題? 還行
3.製作感想: 花好多時間
4.製作作業的時間: 2小時

MEPOERs said:
JinJin: 左側導覽列移過去的時候,字也變色應該會更好喔!
因作業七做完~~

http://mepopedia.com/~web100a/hw07/hw07-1001445074/

1.網頁主題:梵谷
配色與風格設定:藍色調
2.有無遇到的問題? 不知道是wrapper還是content會出現m這個無法連結的...
3.製作感想 表格的多種運用以及連結內文都很實用
4.製作作業的時間 2hrs

MEPOERs said:
JinJin: 你把CSS中 #content{ background-image: url(images/left-bg.gif); 這段拿掉,因為這是我原來的設定,你的資料夾中沒有這張圖所以無法顯現
anling: 我知道了 謝謝老師=D
作業07應該做好了,所以就這樣囉smiling smiley
萬一網址失效大概是還沒上傳..


(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445033

(2).
1.網頁主題:耶穌基督復活
配色與風格設定: 黑白風格
2.有無遇到的問題:還可以。
3.製作感想 :還好欸這樣..
4.製作作業的時間 :3~4小時

MEPOERs said:
JinJin: 記得要上傳喔!
(1).作業網址 :http://mepopedia.com/~web100a/hw08/hw08-1001445080

因上次HW07時就做完了,我也只把BACK多加幾個,就這樣 grinning smiley

(2).請回答以下問題:

1.網頁主題:夏洛克˙福爾摩斯 / 配色與風格設定:咖啡色系
2.有無遇到的問題? 沒有~~
3.製作感想 : 慢慢熟悉了,所以感覺還不錯 ~
4.製作作業的時間 : 2小時



Edited 1 time(s). Last edit at 12/11/2011 11:08AM by Marissa Yeh.
(編輯記錄)

MEPOERs said:
JinJin: 不錯喔!繼續加油囉!
(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445098


(2).請回答以下問題:
1.網頁主題:安迪沃荷
配色與風格設定:普普風加上桃紅色系
2.有無遇到的問題? 沒有什麼太大問題
3.製作感想:這次動作比較複雜,有些還不是很熟悉,大致上還是可以。
4.製作作業的時間:1到2小時(包含找圖和內容)

(1).作業網址 :
http://mepopedia.com/~web100a/hw08/hw08-1001445072/
(2).請回答以下問題:
1.網頁主題:G-Dragon簡介 配色與風格設定:黑白時尚簡約風
2.有無遇到的問題? 無
3.製作感想 已經可以越做越豐富了 很有成就感
4.製作作業的時間 30分鐘

MEPOERs said:
JinJin: 還不錯喔!繼續加油囉!
(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445056


(2).請回答以下問題:
1.網頁主題:莫內
配色與風格設定:藍綠色.優雅
2.有無遇到的問題? 從頭到尾一直遇到問題,想用期中作頁去改但真的太難實在不知從何改起
3.製作感想: 真的好難,完全不知道期末作頁如何著手
4.製作作業的時間:5個小時

MEPOERs said:
JinJin: 目前其實還OK耶!有問題的話可以上課時找我喔!
(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445066/

(2).
1.網頁主題:yoga
配色與風格設定: 黑灰色階
2.有無遇到的問題:左欄的背景圖無法延伸
3.製作感想 :一口氣趕上進度很開心,但也深深感覺到他的複雜性!
4.製作作業的時間 :兩小時

MEPOERs said:
JinJin: 你的架構上出了點小問題#content應該要包住L和R,也要把#content的背景拿掉,不懂的話,記得上課來找我喔!
JinJin: 但其他部部還不錯,繼續加油囉!
http://mepopedia.com/~web100a/hw07/hw07-1001445058/

1.網頁主題:莫內
配色與風格設定:藍綠色
2.有無遇到的問題? 不知道為什麼怎麼調#content-R都會跑到下面去超奇怪的
3.製作感想 還是比較喜歡影片教學
4.製作作業的時間 3hrs

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445021

沿用作業7

(2).請回答以下問題:
1.網頁主題:Ed Hardy
配色與風格設定:同色系
2.有無遇到的問題? 沒有
3.製作感想:感覺有很多東西需要花時間消化
4.製作作業的時間:3個多小時

(1).作業網址 : http://mepopedia.com/~web100a/hw08/hw08-1001445015/

(2).請回答以下問題:
1.網頁主題:莫內的一生
配色與風格設定: 優雅藍綠色調
2.有無遇到的問題:滑鼠過去左邊清單不會變化顏色,BACK也是sad smiley(
3.製作感想:完成完整的網頁其實不會很困難,都可以看得懂了。
4.製作作業的時間:1小時

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445062


(2).請回答以下問題:
1.網頁主題:LADY GAGA天生完美專輯
配色與風格設定:和之前差不多是屬於個性...自己喜歡的配色
2.有無遇到的問題? 很難做...搞了很久...語法太多太多了....有些東西想移位但是不知道怎麼用...
3.製作感想: 好難...在努力...
4.製作作業的時間:4個多小時

(1).作業網址 : http://mepopedia.com/~web100a/hw08/hw08-1001445007

(2).請回答以下問題:
1.網頁主題:莫內 配色與風格設定: 藍綠色
2.有無遇到的問題? 一直點過來點過去看講義....我的小腦袋表示他快不行了....QQ
3.製作感想 超難.....快死了QAQ.......
4.製作作業的時間 前幾次一直到現在才生出來......啾咪...QmQ

(1).作業網址:http://mepopedia.com/~web100a/hw07/hw07-1001445013/
(2).
1.網頁主題:莫內
2.配色與風格設定:藍綠色
3.有無遇到的問題:最上面不知道如何刪掉它
4.製作感想:花很多時間在研究它
5.製作作業的時間:2~3小時

(1).作業網址:http://mepopedia.com/~web100a/hw08/hw08-1001445060/
(2).
1.網頁主題:莫內
2.配色與風格設定:藍綠色
3.有無遇到的問題:無無無
4.製作感想:步驟好多.......
5.製作作業的時間:半小時

作業7

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445076/

(2).請回答以下問題:
1.網頁主題:永遠的印象-莫內 配色與風格設定: 淺藍綠色系
2.有無遇到的問題? 看著講義一步步做還好沒什麼問題
3.製作感想 做的沒有很好但能做出來感覺就很開心
4.製作作業的時間 4小時

(1).作業網址:http://mepopedia.com/~web100a/hw08/hw08-1001445052

(2).請回答以下問題:
1.網頁主題:印象莫內 配色與風格設定:典雅藍綠色為主
2.有無遇到的問題? 此次作業複雜了點!!
3.製作感想:想到會愈上愈難就Orz....................
4.製作作業的時間:hw07 over

(1).作業網址 :
http://mepopedia.com/~web100a/hw07/hw07-1001445068
(2).請回答以下問題:
1.網頁主題:莫內 配色與風格設定: 這次是照老師的做
2.有無遇到的問題? 做到後來有點小亂不知道怎麼弄 這次有點小難
3.製作感想 雖然很難道是會一直想把他完成
4.製作作業的時間 2個多小時

(1).作業網址 :
http://mepopedia.com/~web100a/hw08/hw08-1001445050
(2).請回答以下問題:
1.網頁主題:莫內 配色與風格設定: 看講義做
2.有無遇到的問題? 有點不熟悉@@"
3.製作感想 痾.. 感覺越來越複雜
4.製作作業的時間 2 ~3 個小時

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw08-1001445003
(2).請回答以下問題:
1.網頁主題:楊丞琳 配色與風格設定:水藍清新風
2.有無遇到的問題? 無
3.製作感想 很累
4.製作作業的時間 2小時

老師~那個我的作業真的趕不出來了
因為我家PC上禮拜上課前就壞了拿去修到現在都還沒回來
然後剩下能做得筆電又再做到一半時當機無法做~~可否晚一點再補交呢~

MEPOERs said:
JinJin: OK!
(1).作業網址 : http://mepopedia.com/~web100a/hw08/hw08-1001445126

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:同老師...期末會換
2.有無遇到的問題? 有點霧煞煞 還OK
3.製作感想 ....有點難
4.製作作業的時間 2小時

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445011

P.S-作業07製作完畢。所以算作業08了。

(2).請回答以下問題:
1.網頁主題burberry body
配色與風格設定:灰
2.有無遇到的問題? 有點怪
3.製作感想:難
4.製作作業的時間:2 hr

http://mepopedia.com/~web100a/hw08/hw08-1001445037/
(2).請回答以下問題:
1.網頁主題:貓咪
2.有無遇到的問題? 無
3.製作感想 我的標題會閃ㄟ~不知道為什麼~
4.製作作業的時間 30分鐘

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445118

(2).請回答以下問題:

1.網頁主題:林俊傑的專輯介紹
配色與風格設定:灰階,簡單風格
2.有無遇到的問題? 沒什麼問題,希望講義可以做得簡單一點,這次有點複雜
3.製作感想:愈來愈複雜了orz
4.製作作業的時間 :2-3hr
[color=#CC3300]
ps:上次就完成本次作業進度了spinning smiley sticking its tongue out[/color]

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445001
(2).請回答以下問題:

1.網頁主題:介紹歐陽靖
配色與風格設定:黑色
2.有無遇到的問題? 這次講義好長好長好長
3.製作感想:上次就做完了這次的進度了
4.製作作業的時間 :2-3hr

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445132

作業7作完所以拿來交作業8~

(2).請回答以下問題:
1.網頁主題:電影動畫魔法奇緣
配色與風格設定:粉紅配色以主角的黃色金髮配色
2.有無遇到的問題? 無
3.製作感想 越來越複雜了!繼續努力
4.製作作業的時間 上禮拜就做完了1~2個小時

(1).作業網址 : http://mepopedia.com/~web100a/hw08/hw08-1001445005

(2).請回答以下問題:
1.網頁主題:網頁主題是我最喜歡的日本歌手安室奈美惠
配色與風格設定:至於配色跟風格我都是延續Header所放的圖片
我是找他某張專輯的所拍攝的照片來當背景,所以就延用了與圖片類似的粉紅色做搭配
2.有無遇到的問題? 我的DW會突然當機然後一直顯示無法回應
3.製作感想 感覺這次做的網頁又跟期中的有很不同的感覺,不過卻是越來越難了
4.製作作業的時間 12/13~12/14



Edited 1 time(s). Last edit at 12/14/2011 10:10PM by 1001445005.
(編輯記錄)

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445078

(2).請回答以下問題:

1.網頁主題: 配色與風格設定: 浪漫的風格~~溫暖的配色
2.有無遇到的問題? :還好~~雖然都有做出來 但是感覺怪怪的
3.製作感想 :超有成就感耶~~原來看到的網頁都是這樣做出來的~~
4.製作作業的時間 :2天

(1).作業網址 : http://mepopedia.com/~web100a/hw08/hw08-1001445130

(2).
1.網頁主題:光與影的大師-Claude Monnet 莫內
配色與風格設定: 跟老師的範本一樣為藍綠色調 但我也加入了深藍和中彩度的湖水綠 跟作業7是一樣的東西
2.有無遇到的問題:丟的是上次的作業 所以沒有再改了
3.製作感想 :希望期末作業我能作出自己的東西 加油吧;_;
4.製作作業的時間 :作4~5小時 因為重作的關係所以花了多餘的時間

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445048

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:粉嫩紫色系和亮麗的桃紅 非常日系的風格
2.有無遇到的問題? 有! 我的back一直不肯到右邊去 ˊ ˋ 但是今天老師教過我了,謝謝你~~
3.製作感想 很累,但是一步一步慢慢做出來成果真的很開心
4.製作作業的時間 6~8小時

http://mepopedia.com/~web100a/hw07/hw07-1001445088/profile.html
1.網頁主題: 配色與風格設定:黑白灰
2.有無遇到的問題?
顯示的時候都好奇怪我的籃會變成上下並排 但是上傳後就又好了
L-list li a 那邊我的名子會跳成 content p a 要改成 L-list li a 他就不顯示了...
還有我有做L-list li a:hover sad smiley怎麼會顯示不出來

3.製作感想 如果可以真的好想要整個砍掉重練喔...我把他用的好亂==
4.製作作業的時間 2hr

1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445124
(2).請回答以下問題:
1.網頁主題: 個人網站 配色與風格設定:灰色為主黃綠色為輔
2.有無遇到的問題? 有點難控制
3.製作感想 小累smiling smiley
4.製作作業的時間 約莫4小時

1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445124
(2).請回答以下問題:
1.網頁主題: 個人網站 配色與風格設定:灰色為主黃綠色為輔
2.有無遇到的問題? 問同學,以解決
3.製作感想 spinning smiley sticking its tongue out
4.製作作業的時間 約莫2小時

http://mepopedia.com/~web100a/hw08/hw08-1001445046
1.網頁主題:捉迷藏Hide and Seek
配色與風格設定:深色為主,風格簡單俐落,帶有陰森感
2.有無遇到的問題? : 還好,沒甚麼大礙
3.製作感想:有一點麻煩,不過還算應付得來
4.製作作業的時間:4hr



Edited 2 time(s). Last edit at 12/28/2011 12:03AM by DoNna.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~web100a/hw07/hw07-1001445017


(2).請回答以下問題:
1.網頁主題:五月天
配色與風格設定:黑白簡單
2.有無遇到的問題? 沒有
3.製作感想:其實還可以
4.製作作業的時間:3小時

(1).作業網址 :http://mepopedia.com/~web100a/hw08/hw08-1001445070

(2).請回答以下問題:
1.網頁主題:海底總動員
配色與風格設定:藍色
2.有無遇到的問題? 雙欄很難用
3.製作感想
4.製作作業的時間 2到3天

http://mepopedia.com/~web100a/hw08/hw08-1001445114

1.網頁主題: 配色與風格設定: hollow kitty

2.有無遇到的問題? 無

3.製作感想 因為是期末改的所以無問題

4.製作作業的時間 30分鐘

(1).作業網址 :http://mepopedia.com/~web100a/hw08/hw08-1001445120


(2).請回答以下問題:
1.網頁主題:
配色與風格設定:沈穩暗色掉
2.有無遇到的問題: 有東西跑來跑去
3.製作感想:很難一開始都搞不懂慢慢瞭解了
4.製作作業的時間:5小時

(1).作業網址 : http://mepopedia.com/~web100a/hw07/hw07-1001445108

(2).請回答以下問題:

1.網頁主題:2NE1
2.有無遇到的問題? :是用期中改的 所以沒什麼問題
3.製作感想 :越來越有信心
4.製作作業的時間 :兩個星期



Edited 1 time(s). Last edit at 01/03/2012 11:51PM by 張雍雍.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~web100a/hw08/hw08-1001445102

1.網頁主題: 配色與風格設定: 宮崎駿 蔚藍色調

2.有無遇到的問題 無

3.製作感想 因為是期末作業所以沒遇到什麼問題

4.製作作業的時間 30分鐘