OXXO

早速XDで「line-height」の値を算出する方法を紹介します。

値の算出方法は下記の通りです。

値の算出方法

行送りの値

「行送り」とはXD上の行間のサイズです。

文字を選択した状態で右側メニューから確認することが出来ます。

※行送りはあくまでXD上での行間の値です。[line-height]の値とは異なります。

フォントサイズ

「フォントサイズ」とはXD上のフォントサイズです。

こちらも文字を選択した状態で右側メニューから確認することが出来ます。

「行送りの値」÷「フォントサイズ」で計算する

それぞれの値を元に割り算します。

仮にそれぞれの値が下記の通りだったとします。

この場合算出する「line-height」の値は「30 ÷ 18 = 1.6666…」です。

つまりコーディングの「line-height」の値は約1.6になるということです。

XDでline-heightの値は簡単に算出出来る

最後にまとめです。

line-heightの値を算出する方法！