<span> …… 特別な意味を付加せず範囲指定する
広告
<span>タグは、特別な意味を付加せずグローバル属性を指定する際などに使用します。
span要素に特別な意味はありません。
span要素は、特別な意味を付加することなくグローバル属性を指定する際などに役立ちます。
例えば、class属性でクラス名を指定したり、lang属性で言語を指定するなどの場面で、
span要素が役に立つでしょう。
div要素とspan要素の使い分け
div要素とspan要素の使い分けですが、
div要素は、複数の子要素をまとめてコンテンツブロックをまとめるのに便利です。
span要素は、インラインのテキストなどに対してクラス名や言語などを指定するのに役立ちます。
■使用例
以下のサンプルでは、プログラムコードの各部分にspan要素を使ってクラス名を付けています。
span要素でクラス名を付け分けると、特別な意味を付加することなくCSSで色分けできます。
HTMLソース
<style>
.lang-c {color:#666666;}
.ident {color:#00cccc;}
.keyword {color:#cc0000; font-weight:bold;}
</style>
<pre><code class="lang-c"><span class="keyword">for</span> (<span class="ident">j</span> = 0; <span class="ident">j</span> < 256; <span class="ident">j</span>++) {
<span class="ident">i_t3</span> = (<span class="ident">i_t3</span> & 0x1ffff) | (<span class="ident">j</span> << 17);
<span class="ident">i_t6</span> = (((((((<span class="ident">i_t3</span> >> 3) ^ <span class="ident">i_t3</span>) >> 1) ^ <span class="ident">i_t3</span>) >> 8) ^ <span class="ident">i_t3</span>) >> 5) & 0xff;
<span class="keyword">if</span> (<span class="ident">i_t6</span> == <span class="ident">i_t1</span>)
<span class="keyword">break</span>;
}</code></pre>
↓↓↓
ブラウザ上の表示
for (j = 0; j < 256; j++) {
i_t3 = (i_t3 & 0x1ffff) | (j << 17);
i_t6 = (((((((i_t3 >> 3) ^ i_t3) >> 1) ^ i_t3) >> 8) ^ i_t3) >> 5) & 0xff;
if (i_t6 == i_t1)
break;
}
■関連項目
広告