むねさだブログ
  • プロフィール
  • グルメ
  • ガジェット
  • カメラ・写真
  • 子育て
  • 旅行
  • イベント
  • お問い合わせ
  1. ホーム
  2. ブログカスタマイズ

超基本のhtmlタグ <h2>の使い方をずっと間違えてたぞ・・・

2012/08/29
  • ツイートする

  • シェアする

  • はてブする

このむねさだブログを書き始めて後数日で半年が経とうとしています。

前のブログから引っ越してきた3月4日から、毎日更新し続けてきました。

むねさだブログに移転しました | むねさだブログ

 

 

 

そんな僕が、先日のブログ合宿でみんなに教えてもらった、

知らないとチョット恥ずかしいぞ・・・レベルなことを、

htmlとかの知識が全くなくブログを書いている人の参考になればと思い、ご紹介します。

 
 

SPONSORED LINK
SPONSORED LINK

<h2>タグって文字サイズが大きくなるだけだと思ってた

いきなりですが、<h2>っていうタグがあるのですよ。

これを使うと文字が大きくなるんです。
こんな感じで
 

なので、僕の中では

<h2>タグ=文字が大きくなるタグ

という認識でいて、結構多用してたんです。

 

例えば、
ウマすぎる
とかね。

 

 

当たり前のことが当たり前じゃなかった

そんな感じでブログを書いていたわけで、

そして誰にも突っ込まれて来なかったので疑問にも思わなかったんです。

 

それが、先日のブログ合宿でdelaymania.comに寄稿した際、

初めて判明したんです。

 

何度か説明を受けないと僕も頭で理解できなかったけど、

どうやらWEBの世界では、<h2>は”見出し2”として使うものらしい。

 

見出しって何だ?

↑これが見出しです・・・。

これまた全く知らなかったのですが、

style.cssというものをいじくることによって、<h2>タグで文字を囲むと

自動的に上のような見出しになってくれるんだと。

 

そんな貴重な情報、どうして誰も教えてくれなかったのかね・・・。

 

ってことで、その場にいた切り抜きジャックのタムカイや、

delaymania.comの大ちゃんに教えてもらいながら、CSSと言うものをいじってみました。

みだし

とりあえず、<h2>タグはこれまで多用していたので、

これをこのまま見だしとして運用始めるとどえらいことになる・・・。

というのは僕でも分かるので、ソレを回避する方法も教えてもらう。

クラスというものを使って見出しをつくる
h2.mds {
font-size: 150%;
font-weight:bold;
padding:3px 6px;
margin:0 0 10px 0;
border-left:10px solid #7ee028;
border-bottom:1px solid #7ee028;
}

もうね、呪文のようだけどとりあえずcssに上記を追記して、

普段のブログ書いているhtmlの中に、

<h2 class=”mds”>見だし</h2>

と入れるだけで、見出しデザインになるらしい!

 

そして、文字サイズを変えれるようにこれまたCSSをいじる。

fontsize_css

style.cssで文字サイズを変えれるように追記
/* mu_ne3 original style */
.fontLL{
font-size:200%;
}
.fontL{
font-size:175%;
}
.fontM{
font-size:125%;
}
.fontS{
font-size:81.3%;
}

一応4種類のサイズを容易しておきました。

何を書いているのかほとんど分からないけど、これで文字のサイズが変えられるようになったようだ。

 

ちなみに、文字サイズを変えるときはこういう記述。

<span class=”fontL”>文字サイズ</span>

これで文字サイズが175%の文字が書けるわけです。

 

 

見だしを手に入れたぞ

そして、「むねさだブログ」はついに見出しを手に入れた!

見だしのプレビュー

 

いや~!嬉しいな。

そして、これがあるとブログが読みやすくなるので、

ここを読んでくれている人に、もっと読みやすい記事を提供できるじゃないですか!

 

わんぱくブロガー的まとめ

ブログ合宿ってこういう当たり前だと思っていたことを気づかせてくれる良い機会でした。

 

みなさんも、当たり前だと思っていること、普段やっている行動を

友人や同僚に見てもらってはどうでしょうか?

非効率だったり、綺麗じゃない仕事の仕方をしているかもしれませんよ・・・。

 

聞くは一時の恥、聞かぬは末代の恥

どうせなら早めに聞いて効率や品質を高めて行きたいよね。

まだまだ本当に知らないことだらけだけど、

少しずつ勉強しながら見やすく楽しく役に立つブログを書いていこうと思います。

 

 

ブロガー わんぱくブロガー デザイン
SPONSORED LINK
SPONSORED LINK
  • ツイートする

  • シェアする

  • はてブする

いいね!を押して
最新記事をチェック

おすすめ記事

プロフィール

munesada

ブロガー、むねさだ よしろうです。
ワクワク感で笑顔を拡げる、”わんぱくブロガー”。

新しいものが大好き!食べ物・ガジェット・カメラ・旅行・生活雑貨など興味があるものを幅広くご紹介してます。
iPhone17 Pro Max・MacBook Pro16・Mac mini M4・EOS 5D4・OM-1・Insta360 X5ユーザー。
12歳になる娘がいます。パパ目線での子育てグッズの紹介も。
ScanSnapプレミアムアンバサダー、HHKBエバンジェリスト、おもいでばこ認定アンバサダーなど。

@mu_ne3さんをフォロー
くわしいプロフィール
     Yahoo!エキスパートで記事書いてます

ブログの更新情報

follow us in feedly
@munesada_blogさんをフォロー
むねさだブログ

Facebookページへの「いいね」をして頂けると毎日の更新情報がFacebookで見れます。

人気記事

    • 山梨観光「鳴沢氷穴」と「富岳風穴」どっちがおすすめか?両方に行った感想をまとめたぞ!

    • エアコンのドレンホースを延長したらベランダが濡れなくて気持ちが良いぞ!

    • チャレンジタッチのキーボードをパソコンで使えるように変換ケーブルを買ったぞ!

    • 新サービス発表!ScanSnapユーザーミートアップ2026に参加!「紙がAIの入口になる」未来を感じてきたぞ!

    • 釣りやアウトドアように!板氷が作れる蓋つきアルミ保存容器がコスパ良いぞ!

関連記事

プロブロガー本2が予約開始っ。モチロン購入するぞっ!
書籍

プロブロガー本2が予約開始っ。モチロン購入するぞっ!

【ブロガー必見!】GoogleAnalyticsで自分のブログへの被リンクが分かる「トラックバック」機能が便利だぞ!
ブログカスタマイズ

【ブロガー必見!】GoogleAnalyticsで自分のブログへの被リンクが分かる「トラックバック」機能が便利だぞ!

2年半ぶりにブログテーマを一新!苦手ならプロに任せるのはアリだぞ!
ブログカスタマイズ

2年半ぶりにブログテーマを一新!苦手ならプロに任せるのはアリだぞ!

WordPress 5.5へのアップデートは注意!バグ(不具合)があったのでダウングレードする方法を教えるぞ!
ブログカスタマイズ

WordPress 5.5へのアップデートは注意!バグ(不具合)があったのでダウングレードする方法を教えるぞ!

【要注意!】WordPressを使ったブログのサイドバーに「サイト管理」を残している人は即、外した方が良いぞ…!
ブログカスタマイズ

【要注意!】WordPressを使ったブログのサイドバーに「サイト管理」を残している人は即、外した方が良いぞ…!

ブログカスタマイズの記事をもっと読む

新着記事

セブン「りんご飴仕立てのクイニーアマン」が、りんご飴のカリッと食感で激ウマだぞ!
パン

セブン「りんご飴仕立てのクイニーアマン」が、りんご飴のカリッと食感で激ウマだぞ!

期間限定!サントリー ほろよい〈和梨スカッシュサワー〉がしっかりと和梨の味わいで美味しいぞ!
チューハイ

期間限定!サントリー ほろよい〈和梨スカッシュサワー〉がしっかりと和梨の味わいで美味しいぞ!

【期間限定】ライム香るTHE PEEL(ザ・ピール)〈レモン〉が、ライムの香りとレモンの旨みが楽しめる爽やかなチューハイだぞ!
チューハイ

【期間限定】ライム香るTHE PEEL(ザ・ピール)〈レモン〉が、ライムの香りとレモンの旨みが楽しめる爽やかなチューハイだぞ!

コンビニ限定!じゃがりこジェノベーゼピザ味Lサイズが、まさにピザの味わいで美味しいぞ!
グルメ

コンビニ限定!じゃがりこジェノベーゼピザ味Lサイズが、まさにピザの味わいで美味しいぞ!

新サービス発表!ScanSnapユーザーミートアップ2026に参加!「紙がAIの入口になる」未来を感じてきたぞ!
ガジェット

新サービス発表!ScanSnapユーザーミートアップ2026に参加!「紙がAIの入口になる」未来を感じてきたぞ!

新着記事をもっと読む

おすすめカテゴリー

ガジェット

最新ガジェットや便利グッズ、iPhoneやMacなどをレビュー

ガジェットの記事を見る

グルメ

話題のお店やコンビニグルメ、お取り寄せまで幅広く紹介

グルメの記事を見る

飲み物

コンビニの新商品からビール・チューハイ・ジュースまで。実際に飲んで感じた美味しさをレビュー

飲み物の記事を見る

旅行

旅行先の観光スポットやホテル、旅がもっと楽しくなる情報を紹介

旅行の記事を見る

釣り

堤防釣りを中心に釣行記や道具、釣りを楽しむコツを紹介

釣りの記事を見る

カメラ・写真

カメラ機材のレビューから撮影テクニックまで、写真を楽しむ情報を紹介

カメラ・写真の記事を見る

▶ カテゴリー一覧を見る

agilemedia
むねさだの欲しいものリスト公開中!
むねさだブログ
  • ホームに戻る
  • プロフィール
  • お問い合わせ

© 2026 むねさだブログ

閉じる

  • トップページへ戻る
  • プロフィール
  • お問い合わせ

おすすめカテゴリー

ガジェット

最新ガジェットや便利グッズ、iPhoneやMacなどをレビュー

ガジェットの記事を見る

グルメ

話題のお店やコンビニグルメ、お取り寄せまで幅広く紹介

グルメの記事を見る

飲み物

コンビニの新商品からビール・チューハイ・ジュースまで。実際に飲んで感じた美味しさをレビュー

飲み物の記事を見る

旅行

旅行先の観光スポットやホテル、旅がもっと楽しくなる情報を紹介

旅行の記事を見る

釣り

堤防釣りを中心に釣行記や道具、釣りを楽しむコツを紹介

釣りの記事を見る

カメラ・写真

カメラ機材のレビューから撮影テクニックまで、写真を楽しむ情報を紹介

カメラ・写真の記事を見る
すべてのカテゴリーを見る