この記事では、Webサイト機能における文字のサイズの変更方法についてご案内しています。Hirameki 7のWebサイトでは、見出しパーツやテキストパーツなどであらかじめ、多くの機器(PCやスマートフォン)で読みやすいとされている文字サイズが指定されています。デザイン的に文字サイズを変更する必要がある場合は、こちらのページにある方法で文字サイズを変更してください。
💡文字の色を変更する方法はこちらの記事をご覧ください。
①パーツ全体の文字サイズを変更する方法
パーツ全体の文字サイズを変更する際は、パーツの編集画面から設定を変更します。
パーツの編集画面右上に表示されているアイコンの中から、Tの文字が入ったアイコンをクリックします。(赤枠で囲んだ部分)
ドロップダウンで文字のpixelサイズ(大きさの数値/1px単位)が表示されますので、ご希望のサイズを選んでください。
最小12pxから最大96pxまでのサイズを選択することができます。※全パーツ共通
こちらの設定では、パーツ全体の文字が変更されます。
パーツに入力したテキストのうち、特定の文字列のみサイズを変更したい場合はCSSコードの使用で変更が可能です。
②特定の文字のサイズを変更する方法
特定の文字のサイズを変更する際は、CSSコードを使用します。
大きさを変更する場合
<span style="font-size:20px;">テキスト</span>
フォントサイズの指定方法についてはいくつかの方法があります。上記コード例は、px(ピクセル)単位で指定する方法の記述となります。他に、相対的な指定方法として、◯%や◯emと親要素で指定されているサイズに対して指定する方法があります。
<span style="font-size:120%;">テキスト</span> <span style="font-size:1.2em;">テキスト</span>
タグに追加するCSSコードは、以下のようにサイズだけでなく、色など様々な変更を同時に指定することができます。
<span style="font-size:120%;color:#333333;">テキスト</span>
関連ページ