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

Advanced

[作業06 ] 表格的製作美化與資料整理

[作業06 ] 表格的製作美化與資料整理

請參考

[講義06] 表格的製作
http://mepopedia.com/forum/read.php?804,18062


本講義範例網址
http://mepopedia.com/~jinjin/web/hw06-ex/



的步驟製作,並符合以下條件:

1. 一、製作步驟


1.下載講義中附件的練習檔,或以期末作業進度製作

2.找文字及圖片資料,並設定#header的標題與副標題

3.重新設定#content及#footer的CSS,可參考影音步驟,但不可為一樣的設定

Dreamweaver中#content、#footer、h2、項目清單的CSS設定
http://www.youtube.com/watch?v=gvI0qYcn9ko



4.製作並以美化表格,將資料以表格做整理


Dreamweaver表格製作-TABLE,TR TD TH caption的CSS設定

http://www.youtube.com/watch?v=3gPx_YYE1yI






Dreamweaver表格製作-細部調整、圖片開啟新視窗、超連結等CSS的設定

http://www.youtube.com/watch?v=69CMaum2WPY






Dreamweaver中表格CSS設定以及影音嵌入

http://www.youtube.com/watch?v=lXMUKwYmBqQ






5.在title的部分打上『自己作業的命名』

6.在#footer打上自己的版權聲明

7.請每位同學依步驟完成本單元後,上傳至FTP

8.本次作業的重點在於:

(1 )資料整理,表格製作與美化
(2 )利用CSS,做更細緻的網頁美化設定
(4 )如何利用表格,將圖片、影音與文字的編排搭配出有質感的網頁。





2. 二、繳交作業方式



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

第六個平時作業FTP上的資料夾為:hw06

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

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

存放在 < hw06-學號 > 的資夾內



2.上傳至FTP

3.回覆本篇文章

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-105xxxxxxx

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




(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055440122/form.html

(2).請回答以下問題:
1.網頁主題: 南寮之旅
2.配色與風格設定: 黑粗框與灰色內框,簡單風格
2.有無遇到的問題? 覺得表格挺複雜的,摸索了許久
3.製作感想:繼續努力改變語法做出自己想要的風格及樣式,想要製作一個更有質感的表格。
將資料整理在表格中會有種愉悅的感覺!
4.製作作業的時間 :3小時



Edited 1 time(s). Last edit at 01/02/2018 05:41PM by Ch2254.
(編輯記錄)

1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445054
(2).請回答以下問題:
1.網頁主題:林珉萱(小威老師)
配色與風格設定: 粉紫色想走華麗風格
2.有無遇到的問題? 表格花了很久的時間出了一點小問題~
3.製作感想 雖然問題很多,但有些呈現出來很開心~~
4.製作作業的時間 花了5小時



Edited 1 time(s). Last edit at 01/10/2018 03:06AM by gigiteng.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445015

<<作業6的部分在works的連結處>>

(2).請回答以下問題:
1.網頁主題:大家一起拯救北極熊
2.配色與風格設定:冷冷的藍色象徵冷冷的北極,較成熟的風格來向大家正經的訴說可憐的北極熊 ,需要被你來拯救!
2.有無遇到的問題? 目前還OK
3.製作感想 做完之後發現心情真好呢spinning smiley sticking its tongue out
4.製作作業的時間 3小時左右



Edited 1 time(s). Last edit at 01/02/2018 08:32PM by 大漢堡王.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445075

(2).請回答以下問題:
1.網頁主題: 玩具總動員 (我的作業6是在"about"那一頁)
2.配色與風格設定:藍色系列
2.有無遇到的問題? 目前還可以 沒甚麼太大的問題
3.製作感想 :覺得表格不錯用,能讓資料看得很清楚,做完感覺很有成就感。
4.製作作業的時間 :3~4小時左右



Edited 1 time(s). Last edit at 01/02/2018 08:50PM by 林宥柔.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445036

<<作業6的部分在Spell的連結處>>

(2).請回答以下問題:
1.網頁主題:古老安魔法
2.配色與風格設定:黑暗邪惡,某種咒語神祕的感覺
2.有無遇到的問題? 還不錯喔spinning smiley sticking its tongue out
3.製作感想:好有成就感

4.製作作業的時間 3小時左右

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445129

(2).請回答以下問題:
1.網頁主題:my melody美樂蒂
2.配色與風格設定: 粉粉粉粉粉XDDDD很少女、非常少女
2.有無遇到的問題? :有看老師的影片有解決了
3.製作感想 :我終於做到第3頁了QQ可是有些地方還是沒有做好...之後可能會花一些時間更改
4.製作作業的時間 :因為自己有做一些不一樣的圖片(UNDER是我自己做的)所以有花一些時間,大約4、5個小時(包括改第二頁的一些東西QQ還有第三頁有些地方不太懂就用很久...ORZ)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445150

(2).請回答以下問題:
1.網頁主題: Ghost in the shell
2.配色與風格設定: 藍灰現代感
2.有無遇到的問題? 大致上都ok
3.製作感想 :還是看影片一步步做保險
4.製作作業的時間 :3小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445186

(2).請回答以下問題:
1.網頁主題: 麵包超人
2.配色與風格設定: 橘黃風格
2.有無遇到的問題? 無
3.製作感想 覺得表格搞了很久 要設定很多東西
4.製作作業的時間 : 2個小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445024

(2).請回答以下問題:
1.網頁主題:oystermusic 配色與風格設定: 咖啡色調
2.有無遇到的問題? 無
3.製作感想:不熟練的地方,多嘗試,會得到成就感!
4.製作作業的時間 :1小時多

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445156

(2).請回答以下問題:
1.網頁主題:春艷歌手介紹 配色與風格設定: 天藍色調
2.有無遇到的問題? 無
3.製作感想:好複雜需要花很長的時間搞好
4.製作作業的時間 :2小時多

1).作業網址:http://mepopedia.com/~css106-2c/hw06/hw06-1055445117

(2).請回答以下問題:
1.網頁主題:柯南劇場版介紹配色與風格設定:天藍色調
2.有無遇到的問題?無
3.製作感想:好複雜需要花很長的時間搞好
4.製作作業的時間:2小時多

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445021

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

1.網頁主題: 深町NAGA

2.配色與風格設定: 橘色褐色粉色暖色系

2.有無遇到的問題? 有一些想做的東西,就去實驗但失敗了,應該有其他方法可以

3.製作感想 很開心!雖然做的爛爛的哈哈

4.製作作業的時間 痾幾小時忘了

(1).作業網址:http://mepopedia.com/~css106-2c/hw06/hw06-1055445033/friends.html

(2).請回答以下問題:
1.網頁主題:探險活寶-老皮 配色與風格設定:黃橘色調
2.有無遇到的問題:無
3.製作感想:需要花很多的時間來設定
4.製作作業的時間:2小時多

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445111

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

1.網頁主題:動物之森遊戲

2.配色與風格設定: 綠色自然風

2.有無遇到的問題? css表格的設定不讓我設定orz

3.製作感想 :明明就是用老師的東西但dw不讓我做設定??!!
可能是我有甚麼東西沒有處理到吧orz
html的部分倒是理解的很快所以很快就用好了只是一直卡在CSS的設定上......哀哀

4.製作作業的時間 不知道幾小時wwww

(1).作業網址:http://mepopedia.com/~css106-2c/hw06/hw06-1055445033/video.html

(2).請回答以下問題:
1.網頁主題:服饰介绍
2.有無遇到的問題:無
3.製作感想:
4.製作作業的時間:2小時多

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445096

(2).請回答以下問題:
1.網頁主題:你的名字
2.配色與風格設定:黑白的極簡風
2.有無遇到的問題? CC跟老師教地方好多長不一樣
3.製作感想 做完真的很有成就感
4.製作作業的時間 3小時半

(1).作業網址:http://mepopedia.com/~css106-2c/hw06/hw06-1035471056/video.html
上一篇回復錯誤 請諒解
(2).請回答以下問題:
1.網頁主題:represent服饰介绍
2.有無遇到的問題:無
3.製作感想:無
4.製作作業的時間:2小時多

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445177

(2).請回答以下問題:
1.網頁主題: p714星球
2.配色與風格設定: 藍色系 可愛風
2.有無遇到的問題? 一開始表格的設定設到100與1應該要100與0找很久才發現
3.製作感想 :有把問題找出來覺得很有成就感
4.製作作業的時間 :2小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445102/Awards.html

1.網頁主題: LADY GAGA
2.配色與風格設定: 清新的簡單的
2.有無遇到的問題? 整個表格都是問題~!一直重複看影片好多次才做完
3.製作感想 好難!超難!
4.製作作業的時間 2個禮拜

作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445183

1.網頁主題: mili
2.配色與風格設定: 青色
2.有無遇到的問題? 好難
3.製作感想: 真的好難
4.製作作業的時間 2小時



Edited 1 time(s). Last edit at 01/09/2018 11:06PM by nine999999999.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445120

(2).請回答以下問題:
1.網頁主題: 貓的飼養方法
2.配色與風格設定: 橘黃
3.有無遇到的問題? 還可以
4.製作感想 :還是有請同學教不會的地方
5.製作作業的時間 :3小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445042
(2).請回答以下問題:
1.網頁主題:刺客教條
2.配色與風格設定: 黑暗風格
2.有無遇到的問題? 目前沒有
3.製作感想 表格簡單
4.製作作業的時間 1小時



Edited 1 time(s). Last edit at 01/10/2018 12:52AM by 1055445042.
(編輯記錄)

(1).作業網址:http://mepopedia.com/~css106-2c/hw06/hw06-1055445132/People.html
(2).請回答以下問題:
1.網頁主題:為美好的世界獻上祝福(我的作業6是在"people "那一頁)
2.配色與風格設定:暖色系列
2.有無遇到的問題?目前沒甚麼問題
3.製作感想:覺得表格不錯用,能清楚分辨每個圖示與文章
4.製作作業的時間:3~4小時左右

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445168

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

1.網頁主題: 龍貓
2.配色與風格設定:綠色系列
2.有無遇到的問題? 影片大小比較難抓
3.製作感想 : 有點複雜要花點時間做
4.製作作業的時間 :3~4小時左右

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445207

(2).請回答以下問題:
1.網頁主題: Barry
2.配色與風格設定: 黑白
2.有無遇到的問題? 無
3.製作感想 很鰻正在默默摸索
4.製作作業的時間 2小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445205

(2).請回答以下問題:
1.網頁主題:冰雪奇緣
2.配色與風格設定:藍白色調
2.有無遇到的問題? 沒有
3.製作感想 有點好玩
4.製作作業的時間 2小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445105

(2).請回答以下問題:
1.網頁主題: 維尼
2.配色與風格設定:黃色系列
2.有無遇到的問題? 目前還行
3.製作感想 :做完感覺很有成就感。
4.製作作業的時間 :3小時左右

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055443120
(2).請回答以下問題:
1.網頁主題:决战平安京手游
2.配色與風格設定: 玄幻紫色
2.有無遇到的問題? 无
3.製作感想 累
4.製作作業的時間 7H

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445045

(2).請回答以下問題:
1.網頁主題:B.A.P 回歸造型
2.配色與風格設定: 深灰 淺灰 酒紅
2.有無遇到的問題? 表格太難了..
3.製作感想 只能大致理解怎麼在表格裡擺圖片跟文字
4.製作作業的時間 1小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445063
(2).請回答以下問題:
1.網頁主題: 福山雅治
2.配色與風格設定: 黑灰白色調
2.有無遇到的問題? 無
3.製作感想 難
4.製作作業的時間 2~3小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445135
(2).請回答以下問題:
1.網頁主題: 色彩
2.配色與風格設定:黃色
2.有無遇到的問題? 無
3.製作感想 無
4.製作作業的時間 1小時

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055443135

(2).請回答以下問題:
1.網頁主題: 哈尔滨
2.配色與風格設定: 蓝色雪景
2.有無遇到的問題?
3.製作感想 比较好做
4.製作作業的時間 1小时

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1035445036


1.網頁主題:海賊王 ONE PICE

2.配色與風格設定:黑灰白 + 紅色系 暗紅色 淺紅色

2.有無遇到的問題? 新發現 少了#字聯結會出不來 不會的部分複製老師給的程式碼了 不知道BLAK的位置換地方時要怎麼用才能放在想放的位子

3.製作感想 雖然還是覺得難 不過多做幾次後比較知道哪些程式碼是什麼公用了 但是不邊做邊看教學影片和教學網站 自己就做不出來了 哈哈confused smiley

4.製作作業的時間 合計起來約2天



Edited 1 time(s). Last edit at 01/16/2018 12:18AM by 1035445036.
(編輯記錄)

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1035445087


1.網頁主題:蠟筆小新

2.配色與風格設定:溫馨 紅黃搭配 配合蠟筆小新的風格

2.有無遇到的問題? 因為少上了課所以回家就只好慢慢摸索了當然老師的影片幫助很多
3.製作感想:雖然還是很難,但是慢慢摸索,還是可以有點樣子,期末雖然可能沒有很完整但真的很認真做
4.製作作業的時間:大概一兩天

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445060


1.網頁主題:Skrillex
2.配色與風格設定:白 米黃 紅
2.有無遇到的問題? 沒
3.製作感想:阿災
4.製作作業的時間 30分鐘

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445003

(2).請回答以下問題:
1.網頁主題: 影片與報導
2.配色與風格設定: 黑白橘紅
2.有無遇到的問題? 沒辦法像老師在左邊調整表格 只能省略一格 但是有一格會變特別大
3.製作感想
4.製作作業的時間 一個晚上

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445144


(2).請回答以下問題:
1.網頁主題:BLACKPINK
2.配色與風格設定:黑 粉
2.有無遇到的問題? 好複雜
3.製作感想:好有成就感

4.製作作業的時間 3小時左右

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445159

(2).請回答以下問題:
1.網頁主題:Troye Sivan
2.配色與風格設定:Blue
2.有無遇到的問題? 無,非常順利
3.製作感想 表格排列很方便
4.製作作業的時間 1小時

作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055443122

老师多看下不同的网页 在不同的链接里 谢谢啦