W3.CSSタグ（ラベルと記号）
タグ： 終わり 新しい！ もっと後で！
標識としてのタグ： ファルコンリッジパークウェイ 止まる！ 気を付けて！
W3.CSSタグクラス
W3.CSSは、タグ、ラベル、および記号に1つのクラスを提供します。
| クラス | 定義 |
|---|---|
| w3日 | 長方形の黒いタグ/ラベル |
タグ、ラベル、および標識
W3.CSSの世界では、タグ、ラベル、または記号の間に実際の違いはありません。
タグは長方形です
w3-tagクラスは、長方形のタグ（ラベルまたは記号）を作成します。デフォルトの色は黒です。
状態： 終わり
例
<p>Status: <span
class="w3-tag">Done</span></p>
色付きのタグ
w3- colorクラスを 使用して、タグの色を変更します。
新しい！
もっと後で！
例
<p><span class="w3-tag w3-blue">New!</span></p>
<p><span
class="w3-tag w3-teal">More Later!</span></p>
タグサイズ
デフォルトでは、タグはそのコンテナのサイズを継承します。
w3-サイズクラス（w3-tiny、w3- small、w3-large、w3-xlarge、w3-xxlarge、w3-xxxlarge、w3-jumbo）を使用して、タグのサイズを変更できます。
6 6 6
66 66 66
66 66
大きなタグにパディングを追加することをお勧めします。
例
<span class="w3-tag w3-jumbo w3-blue">66</span>
<span class="w3-tag w3-jumbo
w3-blue w3-padding-large">66</span>
レタータグ
A
U
G
U
S
T
例
<span class="w3-tag w3-xlarge">A</span>
<span class="w3-tag w3-xlarge">U</span>
<span class="w3-tag w3-xlarge">G</span>
<span
class="w3-tag w3-xlarge">U</span>
<span class="w3-tag w3-xlarge">S</span>
<span class="w3-tag w3-xlarge">T</span>
例
<span class="w3-tag w3-jumbo w3-red">S</span>
<span class="w3-tag w3-jumbo">A</span>
<span
class="w3-tag w3-jumbo w3-yellow">L</span>
<span class="w3-tag w3-jumbo">E</span>
サイン
サインは大きなタグに他なりません。
ロンドン動物園
例
<div class="w3-tag w3-xxlarge w3-orange">London Zoo</div>
道路標識
ファルコンリッジパークウェイ
例
<div class="w3-tag w3-round w3-green" style="padding:3px">
<div
class="w3-tag w3-round w3-green w3-border w3-border-white">
Falcon
Ridge Parkway
</div>
</div>
大きな看板
w3サイズのクラスは、大きな記号を表示するために使用できます。
緊急の場合：
地獄のように走りなさい！
例
<span class="w3-tag w3-xxlarge w3-padding w3-orange w3-center">
<strong>
IN CASE OF<br>
EMERGENCY:<br>
RUN LIKE HELL!
</strong>
</span>
49,99 _
例
<span class="w3-tag w3-jumbo w3-green">
49<span class="w3-xlarge">,99</span>
</span>
丸みを帯びた記号
w3-round- sizeクラスを使用して、記号に丸みを帯びた角を追加できます。
水の下で呼吸しないでください
例
<span class="w3-tag w3-padding w3-round-large w3-red w3-center">
DO NOT<br>
BREATHE<br>
UNDER WATER
</span>
回転タグ
標準のCSS変換プロパティを使用して、記号を回転します。
止まる例
<span class="w3-tag w3-xlarge w3-padding w3-red" style="transform:rotate(-5deg)">
STOP
</span>
注： transform：rotate（）は、IE9以前では機能しません。
スピニングタグ
w3-spinクラスを使用して、標識を360度回転させることができます。
止まる例
<span class="w3-tag w3-spin w3-large">
STOP
</span>