一、文本與文本之間的間距處理
在sketch一倍圖中翘狱,一行文字選中時(shí),頂部和底部到邊框距離有留白砰苍,那么行高就是文字的大小和頂部加底部留白的高度潦匈,如下圖所示,文字大小為14赚导,行高為20茬缩,頂部加底部的留白為20-14=6
文本行高
①單行文本和多行文本的間距處理方法:
多行文本的時(shí)候,設(shè)置行高為1.6倍(閱讀更舒適)吼旧,那么文字到邊框會(huì)有留白凰锡,下圖為sketch一倍圖,文字大小為14,行高為16x1.5=22(經(jīng)常需要手動(dòng)設(shè)置行高)寡夹,上下留白為(22-14)÷2=4
多行文本
單行文本把行高設(shè)為0处面,如文字大小為14厂置,行高為文字大小14菩掏,上下留白為0
單行文本
當(dāng)設(shè)置多行文本和單行文本之間的間距為8px,則兩個(gè)文本框之間的距離為8-多行文本留白4=4 則在sketch中測量距離為4px
多行文本、單行文本混排
② 多行文本和多行文本間距處理
多行文本與多行文本之間的間距由上文本底部留白加文本之間的留白和下文本頂部留白昵济。
當(dāng)多行文本字體大小為14智绸,行高為22,頂部和底部留白為(22-14)÷2=4访忿,設(shè)置多行文本和多行文本之間的間距為14px瞧栗,則14-4-4=6
多行文本與多行文本之間的間距