設計網站時,將要使用的圖像在一開始通常還不存在,這個時候布局是最重要的。然而,圖像的尺寸通常是預先設置,實用一些占位圖像可以幫助我們更好地預覽和分析布局。
如今,有免費的占位圖片自動生成工具可以使用,而不是手動創建這些占位符圖像,可以節省我們的時間。這里向大家推薦8款 Web 開發中很實用的占位圖片生成工具。
Placehold.it
這個占位圖片工具功能強大,可以設置圖片大小,圖像格式(GIF,JPG,PNG),還可以顯示文本。
Flickholdr
正如它的名字告訴我們的一樣,Flickrholdr 獲取的圖片來自 Flickr 的龐大的數據庫。
除此圖像的大小之外,它可以在網址設置標簽,這是對於在各個地方使用相關的圖像很有用。
lorempixum
lorempixum 是一個特棒的免費服務,您可以生成任何尺寸和幾乎任何類別圖像(如體育,食品,人等)。
另外,您也可以選擇生成彩色的或者灰度的圖片。
{placekitten}
Placekitten 占位圖片服務,可以顯示任意大小的小貓圖像。喜歡貓的朋友有福了。
還有一個 jQuery 插件,可以方便的動態改變任何的圖像占位符。
Dynamic Dummy Image Generator
DummyImage.com 是另外一個占位符生成工具,有很多的自定義選項,
包括大小,顏色,文字,多種文件類型和大小預設。而且,它是一個開源的腳本。
nosrc.net
一個簡單的占位符工具,你只能夠定義寬度和高度。此外,這個腳本也是開源的。
FPOImg.com
又是一個簡單的占位內容生成工具,除了尺寸,您可以設置顯示文本內容。
IpsumImage
IpsumImage 是一個托管在 Google App Engine 的,基於 Python 實現的占位工具。
這款工具可以幫助你自定義內容區域的大小,背景,前景顏色和要顯示的文本。
flickrBomb
一個簡單的和智能的解決方案,從 Flickr 獲得任意大小的圖像。
只需把這個 jQuery 插件插入到您的網頁,使用下面的方式調用即可:
<img src="flickr://Kevin Bacon" width="175px" height="175px">
lowersrc
這個服務遵循一種不同的實現方法,需要 JavaScript 支持。不需要定義圖像源,但簡單地增加一個特定的類。
除了大小,顏色和文字之外,你還可以設置圖像顯示為矩形或圓形。
編譯來源:夢想天空 ◆ 關注前端開發技術 ◆ 分享網頁設計資源
hide