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

Advanced

[作業01] 以HTML與CSS完成第一個網頁

[作業01] 以HTML與CSS完成第一個網頁

1. 參考講義


1.[講義01] 以 HTML 與 CSS 完成第一個網頁



2. 需下載的軟體


FileZilla 免費又好用的FTP軟體,供客戶端和伺服器端使用
官方下載網頁:http://filezilla-project.org/




3. 繳交作業的方式



1.以FTP上傳至老師指定位置,每一個作業都會有一個相對應的資料夾
如:第一個作業的資料夾為:hw01
每位同學請將自己的資料夾命名為:hw01-學號
這個作業的網址則為:http://mepopedia.com/~css106-2c/hw01/hw01-105xxxxxxx

2.切勿擅改別人的資料檔案,若經發現則以零分計




這禮拜請同學按照講義的步驟及做法,自選文字主題。

1.以自己設定的文字內容,字體大小、文字、背景顏色等,盡可能以最具美感的配色與配置為主
做html與css的設定

2.至少兩個可以互相連結的html檔,其中首頁命名為index.html,另一檔案可命名為about.html
3.以及一個命名為style.css的css樣式檔

存放在hw01-學號的資夾內

http://i.imgur.com/pUK69i6.jpg



並請回覆本篇文章

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

2.有無遇到的問題,製作心得,風格設定與製作作業的時間



4. 參考範例


作業參考
(1) http://mepopedia.com/~web103-a/hw01/hw01-1005445193/
(2) http://mepopedia.com/~web103-a/hw01/hw01-1025445151/
(3) http://mepopedia.com/~web103-c/hw01/hw01-1025443044/
(4) http://mepopedia.com/~web105-2c/hw01/hw01-1045445036/
(5) http://mepopedia.com/~web105-2c/hw01/hw01-1045445162/



Edited 2 time(s). Last edit at 10/18/2017 03:26PM by JinJin.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1055445078
一開始真的都聽不懂
謝謝老師耐心的教我們
我還是覺得我做的很奇怪
希望老師幫我抓豬錯誤
謝謝



Edited 1 time(s). Last edit at 10/18/2017 03:26PM by JinJin.
(編輯記錄)

:http://mepopedia.com/~css106-2c/hw01/hw01-1055445192

其實我真的覺得這是我上大學以來遇到最困難的科目了
但我還是希望可以把它好好學起來
畢竟我真的對這個蠻有興趣的



Edited 4 time(s). Last edit at 10/25/2017 11:45AM by 邱翊淇.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1055445105
這門課雖然很難,但是還是可以學到很多,老師有時候教得有點快。

http://mepopedia.com/~css106-2c/hw01/hw01-1055443120



Edited 1 time(s). Last edit at 11/14/2017 02:57AM by 1055443120.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1035445036

想讓網頁背景顏色不一樣,但是index.html 和about.html共用同一個style.css的時候,body背景的顏色我不知道要怎麼改才能顯示不同的顏色,所以又開了style2.css改背景的顏色,變的亂七八糟的 哈哈

全部加起來因該花了5個多小時製作、研究,但有些地方還是不太懂,發現複製貼上製作速度最快啊 呵呵呵呵呵

風格設定:第一首歌Something Just Like This如此而已The Chainsmokers & Coldplay(老菸槍 酷玩樂團)背景以星空為概念發想,參考MV裡夜晚和天上的星星顏色(天上的星星和夢想一樣遙不可及),夜裡有希望和溫暖(?);第二首歌I can't smile without you沒有你我無法微笑(作詞作曲創作Christian Arnold,David Martin,Geoff Morrow原唱:Barry Manilow)想傳達這首歌的熱情,雖然算是中、慢歌,還是給人溫暖熱情的感覺,參考電影「地獄怪客2」在溫暖的書房裡、壁爐前合唱時的畫面色調。

謝謝老師和小老師指導
P‧S‧不知道為什麼點連結會一直連線到美寶部落格(???)



Edited 3 time(s). Last edit at 10/25/2017 11:16AM by 1035445036.
(編輯記錄)

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055443122
2.感謝老師教學 雖然我很笨還是我還是基本學會了。

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

2.一開始學網頁設計覺得很難 但在老師的耐心教導上,讓我覺得網頁設計只要把語法弄懂就可以做出好的網頁設計
在這次製作的過程中,做錯很多次,但我還是一直努力的把它做好來 希望以後的作品可以愈來愈好。

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

2.謝謝老師這麼用心指導我們,雖然一開始我完全聽不懂老師再說什麼哈哈,可是後面越來越進入狀況了謝謝老師的指導~



Edited 1 time(s). Last edit at 10/19/2017 06:21PM by 1055445129.
(編輯記錄)

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

2.老師教得很好,但是希望可以再放慢一些速度,讓我們比較容易記住,增加一些實作的時間。

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445054

2.我在製作第二網頁body裡的字顏色時,顏色一直跟第一個網頁一樣,
之後才知道第二個網頁裡的"main''要打上2跟第一個網頁做區分~用腦好久~

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

2.有時候在css裡案返回鍵都返回到html的,不知道能不能返回css的
第二首歌的最外面背景想要跟第一首歌的不一樣,所以用了body2但是發現無法修改...,
是不是我哪邊做錯了?還是本來就不用改?

製作過程很開心,只是記得這個語法是做什麼的就比較好做,但是常常忘記所以要抄起來......,
謝謝老師有耐心又愛心的指導我們!

第一首歌採取比較冷想哭的心情做配色,第二首歌則是想要輕鬆愉快的

每次做的時間都比較少,真的要算的話製作時間是2~3天

再次謝謝老師!

http://mepopedia.com/~css106-2c/hw01/hw01-1055445177

剛開始學而以所以對這方面很陌生,不過老師很用心教導!!覺得打對指令很重要不然出不來!第一首是屬於比較慢的歌,可以聆聽歌詞想表達些甚麼,第二首比較輕快,比較有律動一點。

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445087

2.老師很用心,一步一步教學,讓我們學到怎麼簡單做網頁。

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445102
2.剛開始真的是完全看不懂任何的語法,不過老師的耐心教導後我學會時我真的覺得很有趣,

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445060
2.老師您蒸的Hen蚌~



Edited 1 time(s). Last edit at 10/24/2017 09:49PM by 湯劭崴.
(編輯記錄)

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445183
2.好難喔,真的超難,我很畏懼,不過老師教得好好!

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

2.我覺得老師很用心,講的也很詳細,但是希望老師可以講慢一點!!!!!!



Edited 1 time(s). Last edit at 10/24/2017 11:16PM by 施婉晴.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1055445144
電腦只能下載到cc版,導致顏色和字體不會做

作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445156

我覺得上完這堂課之前,網頁是甚麼的,好複雜!!自從上完老師的課經過老師細心詳細的解說,有比較了解怎麼製作了!



Edited 2 time(s). Last edit at 10/25/2017 12:11AM by 高慎妤.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1055445003

遇到連結
main2試做時有點卡卡
但是搞懂之後就很好操作



Edited 1 time(s). Last edit at 10/25/2017 12:48AM by i19980730.
(編輯記錄)

http://mepopedia.com/~css106-2c/hw01/hw01-1055445111

很謝謝老師這麼仔細的教導讓我知道html跟css的真正用途
這次遇到最棘手的應該就是連結了
有分成兩種連結,開新網頁的那個連結總是沒辦法成功
後來是老師說強大的dw有設定可以直接連,所以後來很快就成功了
覺得做成功的第一個網頁設計真的很開心
希望未來還可以繼續做有趣的網頁。



Edited 1 time(s). Last edit at 10/25/2017 01:23AM by 1055445111.
(編輯記錄)

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055440122
2.剛開始學習的時候覺得好容易,但到後面要加上css設定背景的時候就覺得好困難呀,
明明兩個都調不一樣的背景顏色了,可是不知道為什麼又變成一種顏色而已了...
謝謝老師不厭其煩的教導。希望有朝一日能寫出屬於自己的部落格囉~

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

2.在main的設定上一直出問題,可是看了老師的影片逐一檢查後問題都很清楚地浮現並改善了,真的獲益良多。

1:作業網址 http://mepopedia.com/~css106-2c/hw01/hw01-1055445205
2:老師上課有點快.有點跟不上。

http://mepopedia.com/~css106-2c/hw01/hw01-1055445033
有點難但還是聽懂



Edited 1 time(s). Last edit at 10/25/2017 11:58AM by 1055445033.
(編輯記錄)

1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445108

2.有無遇到的問題,製作心得,風格設定與製作作業的時間
第一次試著做網頁,好多英文看了覺得天啊!但過程很有趣,希望自己能越做越好!

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


這真的很難
但老師的教學影片很有幫助
謝謝

Attachments:
開啟 | 下載 - index.html (1.9 KB)
開啟 | 下載 - about.html (2.6 KB)
開啟 | 下載 - style.css (452 bytes)
1.作業網址:http://mepopedia.com/~css106-2c/hw01/hw01-1055445159

2.有無遇到的問題:無,除了忘記上傳
製作心得:第一次自行使用語法設計網頁,很棒
風格設定與製作作業的時間:簡約風,2小時