水瓶的教學網
2015年10月24日 星期六
CSS學習第一堂課-文字樣式
1.文字大小 font-size
HTML的文字經常都會使用CSS來規範,
適當的大小與文字顏色會對網站的可閱讀性增加,
但文字的大小與顏色通常都要將觀眾的年齡考量進來,
因為25歲以下與30歲到40歲或者是45歲以上的閱讀群,
文字大小與可辨識的色彩會有些微的差異。
我們就以網頁文字的em值來說明,em等於16px的字體,
所以1em的文字大小等於16px的文字大小,
如此一來我們就可以清楚文字大小該如何規範了。
繼續閱讀
Illustrator-即時上色油漆桶
這段影片是介紹使用Illustrator的『即時上色油漆桶』工具製作三菱的標誌,
可以透過
多邊形工具
、
線段區段工具
與
即時上色工具
的搭配應用所完成,
最後在使用展開與解散群組的方式就可以完成。
2015年10月22日 星期四
CSS學習第一堂課-淺談選取器
製作網頁首先要了解的是網頁的結構,
HTML是由多個基本的標籤(Tag)所構成,所以了解常用的標籤會對網頁設計有莫大的幫助,
但這篇教學的主角是CSS,所以我們就從CSS的觀念講起。
繼續閱讀
2015年10月20日 星期二
學習CSS的第一步
CSS文字樣式介紹
HTML搭配CSS是網頁設計必備的技巧,在網頁中加入CSS可以有兩種方式,
一種是直接在頁面中建立樣式,另外一種是新增一個樣式表檔案,
然後再以連結外部檔案的方式使用,以下是這兩種方法的說明。
繼續閱讀
什麼是CSS
什麼是
CSS
CSS
樣式表的全名為
Cascading Style Sheet
,
用於規範網頁文字、
HTML
標籤、表格、影像
…
等網頁元素的語言。
網頁製作的主要語言都是使用
HTML
標籤構成,
CSS
樣式表在網頁中所扮演的角色是針對視覺輔助的呈現,例如定義網頁中文字的色彩、
行距,超連結文字互動效果,
表格框線的色彩與樣式、背景色彩
…
等等類型的規範。
繼續閱讀
2015年10月17日 星期六
Illustraotr 符號與符號噴灑器工具
符號是Illustrator形狀資源中很重要的一個功能,符號除了可以重複使用之外,還可以透過「符號噴灑器工具」進行重複製作與調整。接下來我們就利用一個很簡單的範例,來了解符號與「符號噴灑器工具」之間的運作吧!
繼續閱讀
2015年10月9日 星期五
HTML5版面排版-網頁設計教學
HTML5已經是目前網頁開發必備的標籤語法,想要讓網頁設計的技術不落人後,就必須先從基本的版型結構標籤開始。
在早期HTML4之前我們都是使用DIV標籤進行版型編排,但自從HTML 5之後就增加了版型專有的的標籤,其標籤內容如下:
繼續閱讀
Illustrator線條圖筆刷製作方法
線條圖筆刷是illustrator常用的功能之一,筆刷的形狀大部分都是設計師自行製作,製作完成後再套入已經製作完成的路徑中,接下來我們就開始製作這個線條圖筆刷的效果吧!
繼續閱讀
2015年10月3日 星期六
illustrator 緞帶的做法-Mac版
這個影片要帶領大家透過illustrator 製作簡易的緞帶的做法,作業系統為Mac OS,透過『鋼筆工具』建立路徑的方式並搭配『矩形工具』製作一個緞帶。
詳細的內容歡迎觀看教學影片。
2015年10月2日 星期五
iphone 6尺寸規格
一般我們要開始iOS的UI設計前,必須先注意iPhone的版本與尺寸,以下為目前的iPhone版本與尺寸分別為iPhone 6 Plus, iPhone 6, iPhone 5s, iPhone 5c。
繼續閱讀
2015年10月1日 星期四
Sublime Text 3 教學-使用Emmet快速建立HTML標簽1
Sublime快速變成網頁設計師社群推薦的編輯工具,以下的語法你必須參考
Sublime Text 3 :必要的安裝與設定教學
這篇文章,假如你已經閱讀或者已經有安裝Emmet就可以開始以下的步驟。
Step1:建立基本HTML標籤
第一步:你必須要先把檔案儲存為.html的檔案格式,接下來就可以在Sublime中輸入以下的簡碼。
第二部:當你輸入HTML:5後必須按下「Tab」鍵。
html:5
就可以產生以下的HTML標籤。
繼續閱讀
Sublime Text 3 教學-必要的安裝與設定教學
倘若你還沒有安裝sublime可以到以下的網址下載
下載位置:http://www.sublimetext.com/3
安裝的最簡單的方法是透過Sublime的的控制台。
1.開啟控制台的方式可以按下「CTRL +`」或者是打開選單「view / show console」開啟。
繼續閱讀
較新的文章
較舊的文章
首頁
前往Linkit
前往Linkit
關於我自己
steven
檢視我的完整簡介
雲端標籤
Illustrator
(21)
HTML教學
(15)
網頁設計教學
(13)
網頁設計技巧
(7)
逐格動畫
(7)
photoshop
(6)
作品分享
(6)
2D動畫
(4)
Animate教學
(4)
sublime html
(4)
我的攝影日記
(4)
Bootstrap教學
(2)
rwd
(2)
rwd 教學
(2)
網拍密技
(2)
Android APP
(1)
Flash
(1)
IPv4/IPv6網路設定
(1)
iOS UI 設計
(1)
平面設計
(1)
配色技巧
(1)
科技新知
電子產品的故事
關於設計有趣的連結
超強的 Illustrator 網格達人
Typolution-文字也可以很好玩
廣告人的領悟-有點悶
讓人快樂的設計
實用的配色網站-Adobe Color
廣告人之歌
廣告人哪~
網頁設計相關資訊
什麼是無障礙網頁
把你的網址加入 Google
把你的網址加入到 Bing, Yahoo
部落格與網站連結
網頁設計-SBW敦陽數位設計台中網頁設計
Linkit奇藝網頁設計-教學網- Linkit
史蒂文的部落格
Digiview數位醬報– 數位媒體設計
網誌存檔
►
2022
(1)
►
5月
(1)
►
2021
(9)
►
9月
(2)
►
8月
(2)
►
4月
(1)
►
3月
(3)
►
2月
(1)
►
2020
(4)
►
9月
(1)
►
8月
(2)
►
6月
(1)
►
2019
(5)
►
10月
(1)
►
6月
(1)
►
5月
(1)
►
2月
(2)
►
2017
(8)
►
8月
(2)
►
7月
(1)
►
6月
(1)
►
5月
(1)
►
4月
(3)
▼
2015
(20)
►
12月
(2)
►
11月
(4)
▼
10月
(12)
CSS學習第一堂課-文字樣式
Illustrator-即時上色油漆桶
CSS學習第一堂課-淺談選取器
學習CSS的第一步
什麼是CSS
Illustraotr 符號與符號噴灑器工具
HTML5版面排版-網頁設計教學
Illustrator線條圖筆刷製作方法
illustrator 緞帶的做法-Mac版
iphone 6尺寸規格
Sublime Text 3 教學-使用Emmet快速建立HTML標簽1
Sublime Text 3 教學-必要的安裝與設定教學
►
9月
(1)
►
7月
(1)
►
2014
(6)
►
3月
(1)
►
2月
(1)
►
1月
(4)
►
2012
(2)
►
3月
(2)
►
2011
(6)
►
12月
(4)
►
5月
(1)
►
2月
(1)
►
2010
(18)
►
6月
(3)
►
5月
(11)
►
3月
(1)
►
2月
(3)
►
2009
(4)
►
11月
(4)