2010年8月22日

Placehold.it 範例圖片產生器,以網址快速調用任何尺寸的圖片

Placehold.it

設計網頁時常常需要找寬度、長度合適的圖片來填充區塊,或是測試不同大小圖片的表現。這往往可能浪費很多時間,甚至還要自己動手製作某些特殊尺寸的圖片,相當麻煩。透過方便的線上工具Placehold.it ,可以快速產生任何大小的佔位圖片,且能自訂圖片的格式、顯示的文字、顏色等等。

舉例來說,Placehold.it 首頁左側就提供了最基本的使用方式,直接在 http://placehold.it/ 後面填上你要的圖片尺寸,例如 http://placehold.it/350×150 ,然後以 標籤來將圖片貼入網頁,就能夠自動生成 350×150 的圖片。

變更圖片格式:

在 Placehold.it 預設的圖片格式為 gif, 如果你想要使用 .jpeg / .jpg / .png 等圖片格式的話,僅需要在網址後面加上副檔名,例如 http://placehold.it/350×150.png ,這樣就能夠產生 png 格式的佔位圖。

變更圖片文字:

預設的圖片內顯示的是圖片尺寸,不過你可以將它設定為其他文字(不支援中文),目前僅能使用大、小寫的 A-z 、數字及大部分的符號,使用的方法很簡單,只要在網址內加上 &text= 後面接入文字就可以了,例如:http://placehold.it/336×280&text=FreeGroup.org+Cool!

設定圖片背景、文字顏色:

預設圖片使用灰色色系,如果你有需要將圖片的背景、文字顏色做變更,只要在網址後面分別加入背景及文字顏色的 hex codes 即可(#ffffff 是白色),例如:http://placehold.it/250/000000/ffffff (前面被景色、後面文字顏色)。

快速產生正方形圖片:

Placehold.it 圖片高度是選用的。如果你直接在網址後面加入一個數值,例如 http://placehold.it/100 ,那麼就會產生一個 100×100 的正方形圖片,非常簡單。

這個服務真的非常的方便且實用,尤其對於常常製作網頁的朋友來說,省去找範例圖片的麻煩,而且 Placehold.it 也幫你處理了圖片儲存的問題,甚至不用自己上傳、儲存圖片,直接從遠端以網址調用圖片就能使用。

網址:http://placehold.it/

補充

Dummyimage

如果你覺得 Placehold.it 不夠直覺、簡單的話,那麼可以試試看 Dummyimage, 它一樣是個佔位圖片產生器,不過可以設定要產生的圖片尺寸、背景顏色、文字顏色、檔案格式及顯示的文字,使用上較 Placehold.it 簡單一些。

網址:http://dummyimage.com/


Liked the Post? Please subscribe:
*Please click on the confirmation link sent in your Spam folder of Email*

1 意見:

張貼留言

Drop Your Comments, Suggestions And Questions Below.
Click "Subscribe by email" to get notified when replied.
Do Not Add Links To The Body Of Your Comment.

 

Attack of the Dawn Copyright © 2011 -- Template created by Hanley Siu -- Powered by Blogger