SHU BLOG

BLOG NEWS ブログ

TITLE

【HTML】smallの使い方、注釈や小さく表示する要素!

SHU[シュウ]

1991年生まれ九州の宮崎県育ち
高校卒業後、愛知県で自動車関係の
お仕事に5年間勤め、WEB業界に
転職致しました。
趣味:サッカー観戦、ゲーム、映画、漫画
基本インドアです!笑

シュウ
シュウ
今回は【HTML】smallの使い方 注釈や小さく表示する要素!
の解説になります!

こんな方に読んでほしい

  • HTMLを学び始めた方へ
  • HTMLについて学びたい方へ
  • 今回はsmall要素(免責事項、注釈、著作権など)について解説しております。

small要素とは、「免責事項、警告、法的制約、注釈、著作権」などを示す要素になります。
small要素は、はじめから小さなフォントサイズで表示されます。

ChromeChromeSafariSafariFirefoxFirefoxIEIEEdgeEdge

small要素について

small要素について

small要素とは、「免責事項、警告、法的制約、注釈、著作権」などを示す要素になります。
smallで、囲んだ際には「小さなフォントサイズ」で表示されます。

よく使用される箇所としては、「Webサイトのフッターにあるコピーライト」などが多いです。
書き方は以下のようになります。

small要素

例1:コピーライト
(p=16pxで囲んでます。) © 2020 shu-naka-blog
(smallで囲んでます。) © 2020 shu-naka-blog


例2:補足情報

料金について

3,000円(税込み)

<b>例1:コピーライト</b>
<footer>
  <p><small>© 2020 shu-naka-blog</small></p>
</footer>

<b>例2:補足情報</b>
<h3>料金について</h3>
<p>3,000円<small>(税込み)</small></p>

コピーライト(著作権表示)pタグの場合は16pxが指定されております。
smallタグで囲みます、CSSで指定をせず小さなフォントサイズで表示されます。

補足情報には、「税込み」、「税抜き」など、
料金に対して補足情報を表示する際に使用される事が多いです。

small要素の注意点について

small要素は、はじめから小さなフォントサイズで表示されます。
ただ単に、「この文章の文字を小さく表示したい」場合には使用するのは避けしょう。

small要素には、「免責事項、警告、法的制約、注釈、著作権」などを示す意味があります。
ただ単に、文字を小さくしたい場合は、CSSで指定をおこないましょう。

<!--NG-->
<p><small>〇〇ホテルの料金は1泊10,000円(税込み)になります。</small></p>

<!--OK-->
<p>〇〇ホテルの料金は1泊10,000円<small>(税込み)</small>になります。</p>

意味を持たない文章の文字を小さくするには、CSSのfont-sizeを使用しましょう。
small要素には、文章に意味がある際に使用をしましょう。

/*--文章の文字を小さくしたい場合--*/
.font-s {
  font-size: 〇〇; /*--文字サイズ--*/
}

まとめ

今回はこれで以上です。

POINT
  • small要素とは、「免責事項、警告、法的制約、注釈、著作権」などを示す要素になります。
  • small要素は、はじめから小さなフォントサイズで表示されます。
  • ただ単に、「この文章の文字を小さく表示したい」場合には使用するのは避けしょう。
  • 意味を持たない文章の文字を小さくするには、CSSのfont-sizeを使用しましょう。
ChromeChromeSafariSafariFirefoxFirefoxIEIEEdgeEdge
スポンサーリンク

SHU

1991年生まれ九州の宮崎県育ち高校卒業後、愛知県で自動車関係のお仕事に5年間勤め、WEB業界に転職致しました。
趣味:サッカー観戦、ゲーム、映画、漫画基本インドアです!笑
つくる、しあわせをテーマとして主にWEBに関する様々な情報を発信しています。

最新記事

関連記事

オススメ記事

月別アーカイブ

Portfolio

page_top