Foundation 標(biāo)簽

2022-08-05 15:09 更新

.label 類用于提供一些附加信息:

實(shí)例

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

嘗試一下 ?

以下類可以設(shè)置標(biāo)簽的顏色: .secondary, .success, .info, .warning 或 .alert:

實(shí)例

<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 >

嘗試一下 ?

圓角標(biāo)簽

.radius 與 .round 類可以為標(biāo)簽添加圓角：

實(shí)例

<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 >

嘗試一下 ?

標(biāo)簽大小

可以使用 CSS 來修改標(biāo)簽的大小:

實(shí)例

<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>

嘗試一下 ?
以上內(nèi)容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號