ant-design/components/page-header/demo/ghost.md
陈帅 338018eba3
feat: Pageheader new style and props (#19100)
* pure page header style

* add type props

* add prue demo

* add config provider doc

* fix lint

* fix lint error

* change pure to ghost

* fix test

* default ghost is true

* fix review style

* fix review warning

* use online style

* remove defualt and remove comment

* add test
2019-10-15 11:46:12 +08:00

55 lines
1.4 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
order: 2
title:
zh-CN: 白底模式
en-US: white background mode
---
## zh-CN
默认 PageHeader 是透明底色的。在某些情况下PageHeader 需要自己的背景颜色。
## en-US
The default PageHeader is a transparent background. In some cases, PageHeader needs its own background color.
```jsx
import { PageHeader, Button, Descriptions } from 'antd';
ReactDOM.render(
<div
style={{
backgroundColor: '#F5F5F5',
padding: 24,
}}
>
<PageHeader
ghost={false}
onBack={() => window.history.back()}
title="Title"
subTitle="This is a subtitle"
extra={[
<Button key="3">Operation</Button>,
<Button key="2">Operation</Button>,
<Button key="1" type="primary">
Primary
</Button>,
]}
>
<Descriptions size="small" column={3}>
<Descriptions.Item label="Created">Lili Qu</Descriptions.Item>
<Descriptions.Item label="Association">
<a>421421</a>
</Descriptions.Item>
<Descriptions.Item label="Creation Time">2017-01-10</Descriptions.Item>
<Descriptions.Item label="Effective Time">2017-10-10</Descriptions.Item>
<Descriptions.Item label="Remarks">
Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
</Descriptions.Item>
</Descriptions>
</PageHeader>
</div>,
mountNode,
);
```