どうも、チャーさんです。
あなたはspanタグとは何だ?
spanタグって何に使えばいいの?
と思っていませんか。
この記事では、spanタグとは、
そしてspanタグの使い道、使い方について、
書いております。
なので、あなたがこの記事を読めば、
spanタグについての疑問が解消され、
コーディングスキルも幅が広がるでしょう。
なので、spanタグについて疑問がある場合、
このまま下にスクロールして読んでみてください。
スポンサードサーチ
目次
htmlのspanタグとは?
まず結論ですが、
spanタグとは、htmlタグの1つでして、
別にそれ単体では特に何もなさないタグです。
じゃあ、使わんタグやな、
となるかと言えばそうでもないです。
spanタグにはその特性に応じた、
使い道があるのでここからは使い道を紹介します。
スポンサードサーチ
htmlのspanタグの使い道とは?
で、spanの使い道ですが、
何に使えるのか書きます。
- 要素を横並びにする、
- 一部分にcssを適用する、
これらに使えます。
htmlのspanタグで横並び
ではまず横並びをみていきましょう。
spanタグは、メニューなどのような要素を、
横並びにするときに使えます。
というのもspanタグはdivと違いインライン要素です。
(*divはブロック要素)
そしてインライン要素は横並びに配置されるという、
仕組みがあります。
そのため、spanタグを使うと、
メニューなどの横並びを再現できます。
こんな風にです。
なので、ただ単純に横並びにしたい場合、
htmlのspanはインライン要素なので、
他にcssとか何も書かなくても横並びにできます。
(*注意spanの場合幅高さ指定などできないので、
幅を出す場合、フォントサイズや、
letter-spacingなどを使い広げる必要があります。)
htmlのspanで一部分にcss適用できる
また他の使い道としては、
<p>タグなどで囲った文章の一部分に、
cssを適用するときなどに使えます。
例えば、pタグで文章を囲って、
cssを適用すると、pタグで囲われた、
文章全部にcssが適用されますよね。
こんな風に。
しかし、文全体を赤文字にしたいのでなく一部だけ、
cssを適用したい場合、spanタグを使えば、
okです。
例えばspanって文字だけ赤文字にしたいとすると、
このようにspanで囲ったとこだけに、
cssを適用させて、文章の一部分にスタイル適用とか、
できるわけです。
なので、htmlのspanの使い道としては、
一部分にcssを適用するですね。
スポンサードサーチ
htmlのspanタグの使う手順
spanタグの使い方ですが、
基本的に<span>タグで囲ってやるだけです。
そして上記紹介したような使用用途に応じて、
使ってやる形になります。
スポンサードサーチ
まとめ
spanタグとは、htmlタグの1つです。
使い道としては、インライン要素にしたい時とか、
一部分にcssを適用させたい時などですね。
最初は、spanって何に使うの?
思いがちですが、使い道があるので、
知っておくとあなたのページ制作や、
コーディングスキルに幅が出るでしょう。
なので使い道があるので、
一度は使ってみましょう。
さてそれでは早速あなたの、
プログラミングスキルアップのために、
エディターを開いてspanタグで囲ってみましょう。
横並びや、一部分にcss適用などは、
すぐできるので試してみてください。
それでは、読んでもらってありがとうございました。
チャーさん