こんにちわ
sakitoです！
今回はAdobe XDを使っている際に
Adobe XDでテキストの文字間のサイズってどうやって測るの？？
Adobe XDでは文字間のサイズは単位なしになっていて、
コーディングする時にletter-spacingでどう指定すればいいの？？
Adobe XDにおけるletter-spacingの計算方法とかあるの？
ちなみに自分がXDを使っていてそれをコーディングする際に疑問に思った部分です（笑）
今回はこんなお悩みを解決していきますのでよろしくお願いいたします
目次
AV / 1000で求めた値にemをつける
結論からいいます
文字間が指定されているAVという項目の数値を1,000で割り、
その値にemをつけて指定します
XDのAV項目の数値 / 1,000 にemをつける
実際にイメージしやすいように画像で説明していきますね
XDでletter-spacingを計算してみる
AVの値が50に指定されている以下のテキストの場合を例に計算してみましょう
計算式は、50 / 1000 = 0.05。
0.05にemをつけて0.05em。
これをletter-spacingで指定するので実際のコードは
- .class{
- letter-spacing: 0.05em;
- }
簡単ですよね！
数値を１０００で割るのを覚えていきましょう！！
まとめ
簡単な内容になりますが知らない方は多かったのじゃないでしょうか？？
line-heightはどうやるの？？
という方もいると思うのですがそれはこちらの記事でご紹介しますね！
あわせて読みたい
【Adobe XD】 line-heightの計算方法について
こんにちわ sakitoです！ 今回はAdobe XDを使っている際に Adobe XDでテキストの行間のサイズってどうやって測るの？？ Adobe XDでは文字間のサイズは単位なしにな...
コメント