Foundation 標籤
.label
類用於提供一些附加信息:
實例
< h2 > Example < span class= "label" > New < /span > < /h2 >
< h3 > Example < span class= "label" > New < /span > < /h3 >
< h4 > Example < span class= "label" > New < /span > < /h4 >
< 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 >
< 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 >
< span class= "label radius" > Radius Label < /span >
< span class= "label round" > Round Label < /span >
< span class= "label success round" > 5 < /span >
嘗試一下»
標籤大小
可以使用CSS 來修改標籤的大小:
實例
< 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 >
< 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 >
嘗試一下»