style(Tag): adjust size and padding (#6828)
This commit is contained in:
+5
-10
@@ -13,10 +13,9 @@ Vue.use(Tag);
|
||||
|
||||
### 基础用法
|
||||
|
||||
通过`type`属性控制标签颜色,默认为灰色
|
||||
通过 `type` 属性控制标签颜色。
|
||||
|
||||
```html
|
||||
<van-tag>标签</van-tag>
|
||||
<van-tag type="primary">标签</van-tag>
|
||||
<van-tag type="success">标签</van-tag>
|
||||
<van-tag type="danger">标签</van-tag>
|
||||
@@ -25,10 +24,9 @@ Vue.use(Tag);
|
||||
|
||||
### 圆角样式
|
||||
|
||||
通过`round`设置为圆角样式
|
||||
通过 `round` 设置为圆角样式。
|
||||
|
||||
```html
|
||||
<van-tag round>标签</van-tag>
|
||||
<van-tag round type="primary">标签</van-tag>
|
||||
<van-tag round type="success">标签</van-tag>
|
||||
<van-tag round type="danger">标签</van-tag>
|
||||
@@ -37,10 +35,9 @@ Vue.use(Tag);
|
||||
|
||||
### 标记样式
|
||||
|
||||
通过`mark`设置为标记样式(半圆角)
|
||||
通过 `mark` 设置为标记样式(半圆角)。
|
||||
|
||||
```html
|
||||
<van-tag mark>标签</van-tag>
|
||||
<van-tag mark type="primary">标签</van-tag>
|
||||
<van-tag mark type="success">标签</van-tag>
|
||||
<van-tag mark type="danger">标签</van-tag>
|
||||
@@ -49,10 +46,9 @@ Vue.use(Tag);
|
||||
|
||||
### 空心样式
|
||||
|
||||
设置`plain`属性设置为空心样式
|
||||
设置 `plain` 属性设置为空心样式。
|
||||
|
||||
```html
|
||||
<van-tag plain>标签</van-tag>
|
||||
<van-tag plain type="primary">标签</van-tag>
|
||||
<van-tag plain type="success">标签</van-tag>
|
||||
<van-tag plain type="danger">标签</van-tag>
|
||||
@@ -63,7 +59,6 @@ Vue.use(Tag);
|
||||
|
||||
```html
|
||||
<van-tag color="#f2826a">标签</van-tag>
|
||||
<van-tag color="#f2826a" plain>标签</van-tag>
|
||||
<van-tag color="#7232dd">标签</van-tag>
|
||||
<van-tag color="#7232dd" plain>标签</van-tag>
|
||||
<van-tag color="#ffe1e1" text-color="#ad0000">标签</van-tag>
|
||||
@@ -79,7 +74,7 @@ Vue.use(Tag);
|
||||
|
||||
### 可关闭标签
|
||||
|
||||
添加`closeable`属性表示标签是可关闭的,关闭标签时会触发`close`事件,在`close`事件中可以执行隐藏标签的逻辑
|
||||
添加 `closeable` 属性表示标签是可关闭的,关闭标签时会触发 `close` 事件,在 `close` 事件中可以执行隐藏标签的逻辑。
|
||||
|
||||
```html
|
||||
<van-tag
|
||||
|
||||
Reference in New Issue
Block a user