タイトルの下にサブタイトルも入れたいんだけど、文字だらけ。
文字の大きさ変えられないのかな~、なんて思ってる人は結構いるんじゃないでしょうか。
CSSのコードを確認していたら、たまたま発見!
そっか、これを使えばできたんだったと今更ながら気づきました。
↓こんな感じで、1行目と2行目の文字サイズを変える方法をご紹介します。
方法は、CSSで 1行目の文字 を変えます。
1)はじめに、現在設定している文字サイズを調整します。
まず、小さくしたい文字のサイズにあわせて、位置や色を調整してみてください。
↓こんな感じ。
2)スタイルシート(CSS)をコピーして、ヘッダーにペースト(貼り付け)します。
下記のスタイルシートを<style>から</style>までコピーして、
「設定」→「ヘッダー部分を編集」にペースト(貼り付け)してください。
<style>
#emotion-header-title:first-line{
font-size:180%;
color:#000066;
}
</style>
▼補足説明:サイズ
font-size:180%; → 1行目を180%拡大させるという指定です。
数字を変更することで、1行目と2行目の文字サイズの差がかわります。
▼補足説明:カラー
color:#000066; → カラーコードです。
数字を変更することで、色が変わります。
その他のカラーコードは、「文字サイズや色を変更する」ページを参考にしてください。
↓“ヘッダー部分を編集”画面
1度保存して再度開くと、下記が自動的に挿入されてしまいますが、特に問題ありません。
/*<![CDATA[*/
/*]]>*/
プレビューで確認できたら、完了です♪
【作業上の注意】
・編集画面では表示が確認できない場合があります。必ずプレビューで確認してください。
・「ヘッダー部分を編集」にスタイルシートを貼り付けてから、ヘッダーの文字サイズの修正を行うと、うまく変更されない場合があるようです。その場合は、一度スタイルシートを削除して保存した後、もう一度はじめからやり直してみるなどしてください。
・他のCSSなど設定している場合、うまく表示されない可能性がありますのでご注意ください。
以上、ご参考まで!