酷站兩連發！網頁排版對齊神器Graaf+專屬免費圖庫

當設計師把網頁設計稿交給前端開發人員寫代碼后，頁面往往與原稿有些偏著。前端人員寫完頁面后，還需要截圖疊加到設計稿上，去看看偏差比率，這是很麻煩的事情。為了解決這個問題，建議設計師和前端人員看看今天分享的 Graaf 柵格樣式工具。

Graaf

Graaf 可以直接在頁面上顯示柵格線，而且可以自定義柵格結構，大大減少前端或設計師檢測頁面的煩惱。

產品特色：

1. 直接在WEB頁面上顯示柵格，方便前端人員實時調整（贊贊贊）
2. 柵格樣式支持多個流行布局，如：Bootstrap, BBC News, Dribbble, Github, Medium…
3. 支持定制柵格樣式（贊贊贊）

直接在頁面上顯示柵格線

只需要引入CSS 文件就能直接在頁面上顯示柵格線，這些既方便查看頁面錯位，又可以實時刷新調整，再也不用一個個截圖到設計稿了。

<link rel="stylesheet" target="_blank" >

自帶多個柵格樣式

目前自帶了有10多個流行的柵格樣式，只需要替換對應樣式表名稱就行，如下圖，如果你需要 Bootstrap 的柵格，就點擊 bootstrap.css 就能看到樣式表鏈接，然后直接嵌入網頁即可。

自定義柵格樣式（贊）

如果沒有你需要的柵格系統，那么可以簡單修改 CSS 鏈接就可以自定義柵格線了，比如這個鏈接：

https://grids.graaf.space/793/10/16.css

793/10/16分別是寬度、列數、間隔，你只需要修改對應數值就會即時生效，比如設置為寬度：1200px，列數：3列，間距：30 px，那么鏈接就這樣改動：

https://grids.graaf.space/1200/3/30.css

Taiwan Scenery Gallery

（搭梯子訪問）

而且今天重點介紹 Taiwan Scenery Gallery 這個圖庫資源，特色在于圖庫里的所有圖像均來自中國臺灣，所以設計師們如果想找免費的中國臺灣照片，這是一個很好的資源。

據 FLiPER 報道這是由 2 個廣告系中國臺灣本土女生創辦，她們時常思考身在中國臺灣，有沒有可能為中國臺灣做點什么，為中國臺灣留下美的記錄？

水稻 | 攝影：裴

最后她們想到了分享免費圖像的行動，因為喜歡照相的中國臺灣人很多，而需要照片的人也很多，特別是設計師們，這個行動不僅可以幫到需要圖片的人，同時也在向世界傳播著中國臺灣的美。

池上鄉，臺東縣 | 攝影：Eting

這個照片資源全部均為中國臺灣人提供，但…報道前還有100多張，而現在小編看了下，只有44張，也許被購買版權了吧。免費分享的同時，攝影師也能獲得額外收入，這也是不錯的。

臺南海安路(已刪)

桃源谷 | 攝影：Eting

澎湖西嶼（已刪）

澎湖湖西

新竹柿餅 | 攝影：范育銓

雖然目前只是很少的相片，但我們報道后，也會有不少人的參與進來，未來她會繼續成長，敬請關注。

「優設最新神器推薦」

1. 《這款圖標神器，讓你體驗用完即走的暢快感》
2. 《超過5萬張！免費高清可商用圖庫ZOOMMY 3.0重磅來襲！》
3. 《超好用的PS字體管理插件FONTAGS（附安裝方法）》

原文地址：shejidaren

【優設網 原創文章 投稿郵箱：yuan@uisdc.com】

================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺，專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量190萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com