剩下就只剩白色區域了，其實嚴格來說是透明區域，這部分內容是控件內部的間距: 

　　如果還不懂，我們下面來舉個例子。   

　　 3.舉個例子 

    我們就來看下面這個區域怎么實現的： 

　　這樣，一條內容的布局就完成，之后就往相應的地方里面放東西就行了！ 

　　4.注意事項 

　　說個注意事項吧，我們工作中經常遇到的一個問題，看下圖： 

　　兩排文字之間是有間距的（紅色部分高度12像素），但是當我們看開發布局的時候： 

　　 兩個文字控件之間是沒有間距的。 

　　 也就是說，其實字體控件本身上下是帶有一定間距的，如果這時候我們還標注間距為12像素，那實現出來的行間距就會比設計稿要大，所以在做效果圖標注的時候一定考慮好，后期實現出來難免會有微調的情況。 

　　5.總結 

　　沒事的時候可以多看看開發的布局情況，讓自己對頁面的實現有更深的了解。 

轉載于：交互設計學堂

編輯：雷蕾蕾