スワロー・ハミングバード・ストーク・アルバトロスのメニュー文字の大きさを変更するCSS。コピペで対応できる簡単方法

こんにちは。YOSHITAKA(@YOSHITA19704216)です。

初心者
スワロー・ハミングバード・ストーク・アルバトロスのトップページのメニューなどの大きさを変えることはできますか??

よしたか
設定しちゃいましょう。

今回はOPEN CAGE(オープンケージ)社のテンプレートである

STORK(ストーク)・Hummingbird(ハミングバード)・スワロー・アルバトロスの

トップページの文字サイズを変更するCSSを紹介します。

この記事を読むことで
  • ストーク・ハミングバード・スワロー・アルバトロスのトップページの文字サイズを変更するCSSがわかります。
  • 変更する箇所がわかります。

トップページの文字サイズを変更するCSS

CSSの変更する内容

Webサイトの文字サイズは

CSSのfont-sizeプロパティの値で変えることができます。

 

次のCSSが文字サイズに対応するCSSです。

 

記載してあるfont-sizeの値は

デフォルト(初期状態)のものです。

/* サイト説明 */ .site_description { font-size: 10px; } 

/* ヘッダー情報 */ .header-info a { font-size: .8em; } 

/* カード型タイトル */ .post-list-card .post-list .entry-content .entry-title { font-size: 1.15em; } 

/* カード型記事本文 */ .post-list-card .post-list .entry-content p { font-size: .9em; } 

/* ウィジェットタイトル */ .widgettitle { font-size: 1em; }

 

上記のfont-sizeの数値を

お好みに合わせて数値変更してください。

 

修正例

例えば・・・・・

 

18pxから12pxに文字サイズを小さくしたい場合は

次のように修正します。

 

font-size: 18px;

↓ ↓ ↓

font-size: 12px;

値は任意で変更が大丈夫です。

ターゲットがご高齢なら文字を大きくするのもありです。

 

ご自身のお好みの大きさに合わせて

数字の修正を行ってください。

基礎情報

font-sizeの値の単位は、「px」、「%」、「em」などがあります。

(単位については、この記事では詳しく説明しません。)

 

ちなみに・・・・・

 

font-sizeの単位に「em」があります。

これは小数単位で文字サイズの指定ができます。

 

emの値が1以下の場合

小数点の前の「0」を省略することができます。

 

 

つまり・・・・・・

「.9em」と「0.9em」は同じ文字サイズを表します。

 

まとめ

今回は

スワロー・ハミングバード・ストーク・アルバトロスの

メニュー文字の大きさを変更するCSSのご紹介でした。

 

コピペで対応できる簡単方法ですので

実際に対応してみて下さい。

 

数字を変えるだけですぐにできるはずです。

 

あなたは「Web集客」に限界を感じていませんか?

サイトをただ作るだけで満足ですか?

あなたのサービスやコンテンツはとっても有益なものがたくさんあります。

良いコンテンツも埋もれてしまっては全く意味がありません。

正しい知識と実践で、SEO対策はもちろん、ユーザビリティーを考えたサイトを作りませんか?

私と歩めばWebマーケティング知識とWordPressスキルが定着し、サイト回遊率、再訪問がアップします。

しかも、これだけでは終わりません!!

その先の「攻めのメディア」と組み合わせ、あなたのサービスを広めて売上を伸ばしていきます。

サイトを育てて、長い間愛されることのできるWordPressサイトからの集客導線(ゴールデンルート)を一緒に作りませんか?

↓ ↓ ↓ ↓ ↓ ↓ 

おすすめの記事