[作業03] Font Awesome字型練習與應用
|
[作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
Moderator March 29, 2018 03:09AM 發表文章數: 1,229 |
1. 參照 [講義] 製作
[講義] 使用圖示字體(icon font) Font Awesome
http://mepopedia.com/forum/read.php?804,87786
[hr]
2. 作業說明
1.可以作業一延續製作，將Font Awesome字型應用於其中
2.網頁內容若有涉及他人作品，請取得作者同意，或於footer註明，此網站為作業練習，如有侵權敬請告知
3.並回覆於本篇作業文章
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-105ooooo
(2).設計概念與製作心得：
3. 於作業一中修改練習
如加入分享連結圖示，並放大兩倍fa-2x
於標題中加入旋轉圖示
4. 上課影片
https://youtu.be/BrslTed-BB4
Edited 1 time(s). Last edit at 04/07/2018 01:16AM by JinJin.
(編輯記錄)
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 09, 2018 09:02PM 發表文章數: 18 |
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 10, 2018 08:26PM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445075
(2).設計概念與製作心得：利用深色的顏色系列，來突出韓風的感覺。再加上一些旋轉圖示以及分享連結圖示讓這個網頁更有生動感，但我一個問題就是分享連結圖示加了連結網址顏色就跑掉了，我也找不出要從哪裡改顏色。
(2).設計概念與製作心得：利用深色的顏色系列，來突出韓風的感覺。再加上一些旋轉圖示以及分享連結圖示讓這個網頁更有生動感，但我一個問題就是分享連結圖示加了連結網址顏色就跑掉了，我也找不出要從哪裡改顏色。
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 11, 2018 04:03PM 發表文章數: 18 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445036
(2).設計概念與製作心得：那個齒輪很像花所以就用了，但是實在想不到要放哪裡
(2).設計概念與製作心得：那個齒輪很像花所以就用了，但是實在想不到要放哪裡
|
1055445039
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 10:24AM 發表文章數: 15 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445039
(2).設計概念與製作心得：覺得小齒輪...等等 不太適合我的內容，故放嘞一些簡單的箭頭
(2).設計概念與製作心得：覺得小齒輪...等等 不太適合我的內容，故放嘞一些簡單的箭頭
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 11:57AM 發表文章數: 18 |
http://mepopedia.com/~web106-2c/hw03/hw03-1055445087
2.設計概念與製作心得：在主題的地方用了 一個可愛活潑的圖示來呼應蠟筆小新調皮的個性
2.設計概念與製作心得：在主題的地方用了 一個可愛活潑的圖示來呼應蠟筆小新調皮的個性
|
1055445177
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 19, 2018 11:03AM 發表文章數: 20 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445177
(2).設計概念與製作心得： 覺得加了圖示變得比較趣味.不過圖示的顏色想了一下才知道是哪裡改。
(2).設計概念與製作心得： 覺得加了圖示變得比較趣味.不過圖示的顏色想了一下才知道是哪裡改。
|
1055445004
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 11, 2018 08:40PM 發表文章數: 21 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445004
(2).設計概念與製作心得：利用多個警告標示顯示出雲豹即將滅種的危機
(2).設計概念與製作心得：利用多個警告標示顯示出雲豹即將滅種的危機
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 11, 2018 09:24PM 發表文章數: 13 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445186
(2).設計概念與製作心得： 放上小圖示覺得更有感覺,但是不知道fb和ig的圖示顏色該怎麼改!
(2).設計概念與製作心得： 放上小圖示覺得更有感覺,但是不知道fb和ig的圖示顏色該怎麼改!
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 11, 2018 09:47PM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445054
(2).設計概念與製作心得：
版面配色黑紅為主，因為是楓葉 所以icon用可愛的葉子
不敢做太大 怕毀了整體感覺
(2).設計概念與製作心得：
版面配色黑紅為主，因為是楓葉 所以icon用可愛的葉子
不敢做太大 怕毀了整體感覺
|
1055445033
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 11, 2018 10:32PM 發表文章數: 17 |
http://mepopedia.com/~web106-2c/hw03/hw03-1055445033
2.設計概念與製作心得：與主題式蔬菜為主所以找葉子圖示放入標題 ,再加上一些旋轉圖示放到小段落前這樣畫面生動許多。
2.設計概念與製作心得：與主題式蔬菜為主所以找葉子圖示放入標題 ,再加上一些旋轉圖示放到小段落前這樣畫面生動許多。
Edited 1 time(s). Last edit at 04/11/2018 10:55PM by 1055445033.
(編輯記錄)
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 01:13AM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445021
(2).設計概念與製作心得：
以黑夜與白天所感受到不同光線來製作，黑夜由月亮代表、早晨則是由太陽做出。
圖示很可愛~~~但是蠻想知道為什麼有些網頁的圖示可以多加圓圈之類的東西，
是自己重新製作，還是可以直接在DW上加？
(2).設計概念與製作心得：
以黑夜與白天所感受到不同光線來製作，黑夜由月亮代表、早晨則是由太陽做出。
圖示很可愛~~~但是蠻想知道為什麼有些網頁的圖示可以多加圓圈之類的東西，
是自己重新製作，還是可以直接在DW上加？
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 11:22AM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445015
(2).設計概念與製作心得：
加了小圖示真可愛呢!
(2).設計概念與製作心得：
加了小圖示真可愛呢!
|
1055445086
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 12:33PM 發表文章數: 19 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445086
(2).設計概念與製作心得：soufflé 天子舒芙蕾，利用暖色系製造甜美可口的感覺 (圖示旋轉好好玩)
(2).設計概念與製作心得：soufflé 天子舒芙蕾，利用暖色系製造甜美可口的感覺 (圖示旋轉好好玩)
|
1055445150
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 12:01PM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445150
(2).設計概念與製作心得： 增加圖示讓畫面變很可愛，也簡單明瞭
(2).設計概念與製作心得： 增加圖示讓畫面變很可愛，也簡單明瞭
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 12, 2018 12:04PM 發表文章數: 17 |
(1) http://mepopedia.com/~web106-2c/hw03/hw03-1055445156
(2) 會動了! 加了圖示更棒哒
(2) 會動了! 加了圖示更棒哒
Edited 1 time(s). Last edit at 04/12/2018 12:08PM by 高慎妤.
(編輯記錄)
|
1055445206
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 03, 2018 07:54AM 發表文章數: 10 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445206
(2).設計概念與製作心得： 不知道該如何把圖示動起來
(2).設計概念與製作心得： 不知道該如何把圖示動起來
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 13, 2018 02:13PM 發表文章數: 18 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445024
(2).設計概念與製作心得：經過反覆地摸索與練習，終於做出來了!!! 有了小icon，也讓整個網頁更完整了!
(2).設計概念與製作心得：經過反覆地摸索與練習，終於做出來了!!! 有了小icon，也讓整個網頁更完整了!
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 13, 2018 03:28PM 發表文章數: 16 |
http://mepopedia.com/~web106-2c/hw03/hw03-1055445017/
設計概念與製作心得： 標題前加上旋轉圖示區分不同段落的感覺，還有放上一些適合原本風格的圖示，讓畫面變得不會那麼單調
設計概念與製作心得： 標題前加上旋轉圖示區分不同段落的感覺，還有放上一些適合原本風格的圖示，讓畫面變得不會那麼單調
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 13, 2018 09:22PM 發表文章數: 20 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445003
(2).設計概念與製作心得： 覺得畫面變得更生動可愛了
(2).設計概念與製作心得： 覺得畫面變得更生動可愛了
|
1055445111
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 19, 2018 01:06AM 發表文章數: 21 |
1).網址: http://mepopedia.com/~web106-2c/hw03/hw03-1055445111
(2).設計概念與製作心得：好像沒有櫻花的圖示好可惜qq
但是多了圖示蠻好玩的
然後我明明有改圖片檔名還有把圖片縮小但是為什麼沒辦法像第一次作業一樣讀出來orz
(2).設計概念與製作心得：好像沒有櫻花的圖示好可惜qq
但是多了圖示蠻好玩的
然後我明明有改圖片檔名還有把圖片縮小但是為什麼沒辦法像第一次作業一樣讀出來orz
Edited 1 time(s). Last edit at 04/19/2018 01:15AM by 1055445111.
(編輯記錄)
|
1055445144
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 18, 2018 12:16PM 發表文章數: 17 |
1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445144
(2).設計概念與製作心得：以葉子呼應內容
(2).設計概念與製作心得：以葉子呼應內容
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 19, 2018 09:19AM 發表文章數: 22 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-10555443135
(2).設計概念與製作心得：根据作业一改的，放假加生病作业欠了好多，哈哈~
(2).設計概念與製作心得：根据作业一改的，放假加生病作业欠了好多，哈哈~
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 19, 2018 11:10AM 發表文章數: 22 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055443135
(2).設計概念與製作心得：
(2).設計概念與製作心得：
|
1055445168
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 24, 2018 11:35PM 發表文章數: 15 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445168
(2).設計概念與製作心得：加了小圖示感覺比較生動!
(2).設計概念與製作心得：加了小圖示感覺比較生動!
|
1055445110
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 26, 2018 10:02PM 發表文章數: 15 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445110
(2).設計概念與製作心得：
icon蠻有趣的，雖然中途有點不知道要放哪裡...不過最後多虧老師的影片
(2).設計概念與製作心得：
icon蠻有趣的，雖然中途有點不知道要放哪裡...不過最後多虧老師的影片
|
1055445102
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 29, 2018 02:24AM 發表文章數: 16 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445102
Edited 1 time(s). Last edit at 04/29/2018 02:25AM by 1055445102.
(編輯記錄)
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 29, 2018 08:27PM 發表文章數: 17 |
1055445085 林安情
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445085
(2).設計概念與製作心得：摸索了有點久，但是實在想不出要放哪力就放在標題跟副標上。
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445085
(2).設計概念與製作心得：摸索了有點久，但是實在想不出要放哪力就放在標題跟副標上。
|
jolin82145
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 29, 2018 10:00PM 發表文章數: 20 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445059
(2).設計概念與製作心得：加會轉小圖很可愛，滿好玩的
(2).設計概念與製作心得：加會轉小圖很可愛，滿好玩的
|
1055445042
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 29, 2018 10:56PM 發表文章數: 19 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445042
(2).設計概念與製作心得 : 超簡單的作業，棒
(2).設計概念與製作心得 : 超簡單的作業，棒
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
April 29, 2018 11:11PM 發表文章數: 17 |
網址:http://mepopedia.com/~web106-2c/hw03/hw03-1055445183
設計概念與製作心得：土色的感覺 然後小圖示很棒
設計概念與製作心得：土色的感覺 然後小圖示很棒
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 02, 2018 01:41PM 發表文章數: 18 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445182
(2).設計概念與製作心得: 邊看影片邊做，很有成就感。
(2).設計概念與製作心得: 邊看影片邊做，很有成就感。
|
1055445205
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 02, 2018 09:43PM 發表文章數: 14 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445205
(2).設計概念與製作心得：我覺得很多圖示很可愛，但是還是圈圈最可愛，所以我只用了那個。
(2).設計概念與製作心得：我覺得很多圖示很可愛，但是還是圈圈最可愛，所以我只用了那個。
Edited 1 time(s). Last edit at 05/02/2018 09:57PM by 1055445205.
(編輯記錄)
|
1045445134
[ 站內寄信 / PM ]
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 03, 2018 12:05PM 發表文章數: 13 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1045445134
(2).設計概念與製作心得： 雖然一開始有點搞不懂，但我終於成功了
(2).設計概念與製作心得： 雖然一開始有點搞不懂，但我終於成功了
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 03, 2018 11:41PM 發表文章數: 17 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445096
(2).設計概念與製作心得：我覺得會轉動的圖示真的很酷，以後有機會一定會應用在網頁上。
(2).設計概念與製作心得：我覺得會轉動的圖示真的很酷，以後有機會一定會應用在網頁上。
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 04, 2018 12:46PM 發表文章數: 18 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445119
(2).設計概念與製作心得：不知道為什麼第一個做的動畫也一起動了QQ無法讓它們和平共處
(2).設計概念與製作心得：不知道為什麼第一個做的動畫也一起動了QQ無法讓它們和平共處
|
Re: [作業03] Font Awesome字型練習與應用
分類標籤: 106-2《中國》竹視傳二C-進階網頁設計
|
May 05, 2018 03:57PM 發表文章數: 18 |
(1).網址: ：http://mepopedia.com/~web106-2c/hw03/hw03-1055445060
(2).設計概念與製作心得：簡潔/電腦爛做網頁超級痛苦各種當機我都快要哭出來了
(2).設計概念與製作心得：簡潔/電腦爛做網頁超級痛苦各種當機我都快要哭出來了
MEPO forum
is powered by Phorum.