mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-02 20:19:44 +08:00
添加带有 icon 的样式
This commit is contained in:
parent
dda240d09b
commit
4c1014d905
28
components/tabs/demo/icon.md
Normal file
28
components/tabs/demo/icon.md
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
# 图标
|
||||||
|
|
||||||
|
- order: 2
|
||||||
|
|
||||||
|
带有图标。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
````jsx
|
||||||
|
var Tab = antd.Tab;
|
||||||
|
var TabPane = Tab.TabPane;
|
||||||
|
|
||||||
|
function callback() {}
|
||||||
|
|
||||||
|
var tabContent = [
|
||||||
|
<span><i className="anticon anticon-lock"></i>tab 1</span>,
|
||||||
|
<span><i className="anticon anticon-lock"></i>tab 2</span>,
|
||||||
|
<span><i className="anticon anticon-lock"></i>tab 3</span>,
|
||||||
|
]
|
||||||
|
|
||||||
|
React.render(
|
||||||
|
<Tab defaultActiveKey="2" onChange={callback}>
|
||||||
|
<TabPane tab={tabContent[0]} key="1">选项卡一</TabPane>
|
||||||
|
<TabPane tab={tabContent[1]} key="2">选项卡一</TabPane>
|
||||||
|
<TabPane tab={tabContent[2]} key="3">选项卡一</TabPane>
|
||||||
|
</Tab>
|
||||||
|
, document.getElementById('components-tabs-demo-icon'));
|
||||||
|
````
|
@ -152,6 +152,14 @@
|
|||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
display: block;
|
display: block;
|
||||||
color: #666;
|
color: #666;
|
||||||
|
|
||||||
|
.anticon {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
margin-right: 12px;
|
||||||
|
top: -1px;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
> a:hover {
|
> a:hover {
|
||||||
|
Loading…
Reference in New Issue
Block a user