ant-design/components/avatar/demo/basic.md
二货机器人 64b905e9bd
chore: Update @ant-design/icons deps (#19979)
* update icons deps

* update all icon ref

* fix lint

* update snapshot
2019-11-28 12:34:33 +08:00

45 lines
918 B
Markdown

---
order: 0
title:
zh-CN: 基本
en-US: Basic
---
## zh-CN
头像有三种尺寸,两种形状可选。
## en-US
Three sizes and two shapes are available.
```jsx
import { Avatar } from 'antd';
import { UserOutlined } from '@ant-design/icons';
ReactDOM.render(
<div>
<div>
<Avatar size={64} icon={<UserOutlined />} />
<Avatar size="large" icon={<UserOutlined />} />
<Avatar icon={<UserOutlined />} />
<Avatar size="small" icon={<UserOutlined />} />
</div>
<div>
<Avatar shape="square" size={64} icon={<UserOutlined />} />
<Avatar shape="square" size="large" icon={<UserOutlined />} />
<Avatar shape="square" icon={<UserOutlined />} />
<Avatar shape="square" size="small" icon={<UserOutlined />} />
</div>
</div>,
mountNode,
);
```
<style>
#components-avatar-demo-basic .ant-avatar {
margin-top: 16px;
margin-right: 16px;
}
</style>