スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ブログなどで行間や文字間隔を指定

ブログなどで文章によっては行間を広くしたり、また文字間隔をあけたりしたい場合がありますね。このような場合はstyleで設定できます。下は特に指定していない状態です。
春はあけぼの。やうやう白くなり行く、山ぎは少しあかりて、紫だちたる雲の細くたなびきたる。
夏は夜。月のころはさらなり。やみもなほ、ほたるの多く飛びちがひたる。また、ただ一つ二つなど、ほのかにうち光りて行くもをかし。雨など降るもをかし。
(枕草子より)

次に行間隔を2倍にします。
春はあけぼの。やうやう白くなり行く、山ぎは少しあかりて、紫だちたる雲の細くたなびきたる。
夏は夜。月のころはさらなり。やみもなほ、ほたるの多く飛びちがひたる。また、ただ一つ二つなど、ほのかにうち光りて行くもをかし。雨など降るもをかし。
(枕草子より)

この部分のソースは次のようになっています。
行間を指定したい文の区間を<span ></span>で指定して <span style="line-height : 2;">文字列</span>とすればいいのです。2を3にすれば3倍になります。

同様にこの部分で文字間隔の指定もできます。
春はあけぼの。やうやう白くなり行く、山ぎは少しあかりて、紫だちたる雲の細くたなびきたる。
夏は夜。月のころはさらなり。やみもなほ、ほたるの多く飛びちがひたる。また、ただ一つ二つなど、ほのかにうち光りて行くもをかし。雨など降るもをかし。
(枕草子より)

この部分のソースは下です。
<span ></span>で指定して <span style="line-height : 2;letter-spacing: 0.5em;">文字列</span>
letter-spacing: 0.5em; が間隔指定部分です。
ここで使われている[em]という単位は、フォントサイズをを1とする場合の相対的サイズで、[%]でも指定できます。また[px]で絶対的な値を指定することもできます。
文章によっては行間や文字間隔でメリハリをつけるのも面白いでしょうね。
スポンサーサイト

コメントの投稿

非公開コメント

プロフィール

ja6ei

Author:ja6ei
FC2ブログへようこそ!

カレンダー
07 | 2017/08 | 09
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -
最近の記事
最近のコメント
最近のトラックバック
月別アーカイブ
カテゴリー
ブロとも申請フォーム

この人とブロともになる

リンク
ブログ内検索
RSSフィード
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。