Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

Foundation label


May 04, 2021 Foundation5


Table of contents


Foundation label

.label class is used to provide some additional information:

Instance

< h2 > Example < span class= "label" > New < /span > < /h2 >
< h3 > Example < span class= "label" > New < /span > < /h3 >
< h4 > Example < span class= "label" > New < /span > < /h4 >

尝试一下 »

以下类可以设置标签的颜色: .secondary , .success , .info , .warning .alert :

实例

< span class= "label" > Default Label < /span >
< span class= "label secondary" > Secondary Label < /span >
< span class= "label success" > Success Label < /span >
< span class= "label info" > Info Label < /span >
< span class= "label warning" > Success Label < /span >
< span class= "label alert" > Alert Label < /span >

尝试一下 »

圆角标签

.radius .round 类可以为标签添加圆角:

实例

< span class= "label" > Default Label < /span >
< span class= "label radius" > Radius Label < /span >
< span class= "label round" > Round Label < /span >
< span class= "label success round" > 5 < /span >

尝试一下 »

The label size

You can use CSS to modify the size of the label:

Instance

< h1 > Example < span class= "label" style= "font-size:36px;" > New < /span > < /h1 >
< h2 > Example < span class= "label" style= "font-size:30px;" > New < /span > < /h2 >
< h3 > Example < span class= "label" style= "font-size:20px;" > New < /span > < /h3 >
< h4 > Example < span class= "label" > New < /span > < /h4 >

尝试一下 »