W3.CSS 标签

标签：完毕新的！更多稍后！

标签作为标志：猎鹰岭大道停止！小心！

W3.CSS 标签类

W3.CSS 为标记、标签和标志提供了一个类：

类	定义
w3 标签	矩形黑色标签/标签

标签、标签和标志

在 W3.CSS 世界中，标记、标签或标志之间没有真正的区别。

标签是矩形的

这个w3 标签类创建一个矩形标签（标签或标志）。默认颜色为黑色：

地位：完毕

示例

Status: Done

亲自试一试»

彩色标签

用一个w3-颜色更改标签颜色的类：

新的！

更多稍后！

示例

New!
More Later!

亲自试一试»

标签尺寸

默认情况下，标签将继承其容器的大小。

这个w3-尺寸类（w3-tiny、w3-small、w3-large、w3-xlarge、w3-xxlarge、w3-xxxlarge、w3-jumbo）可用于修改标签的大小：

6 6 6

66 66 66

66 66

您可能想为大标签添加一些额外的填充：

示例

66
66

亲自试一试»

字母标签

A U G U S 时间

示例

A
U
G
U
S
T

亲自试一试»

S A L 乙

示例

S
A
L
E

亲自试一试»

标志

标志只不过是大标签。

伦敦动物园

示例

<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-尺寸类可用于显示大标志：

的情况下
紧急情况：
拼命奔跑！

示例

IN CASE OF 
EMERGENCY: 
RUN LIKE HELL!

亲自试一试»

49 ,99

示例

49,99

亲自试一试»

圆形标志

这个w3-轮-尺寸类可用于向标志添加圆角：

不要
呼吸
水下

示例

DO NOT 
BREATHE 
UNDER WATER

亲自试一试»

旋转标签

使用标准 CSS 变换属性来旋转标志：

停止

示例

STOP

亲自试一试»

笔记：Transform:rotate() 在 IE 9 及更早版本中不起作用。

旋转标签

这个w3旋转类可用于让标志旋转 360 度：

停止

示例

STOP

亲自试一试»