ant-design/components/page-header/index.en-US.md

---
category: Components
type: Navigation
title: PageHeader
cols: 1
subtitle:
---

The header can be used to declare the page topic, display important information about the page that the user is interested in, and carry the action items related to the current page (including page-level operations, inter-page navigation, etc.)

## When To Use

It can also be used as inter-page navigation when it is needed to make the user quickly understand what the current page is and to facilitate the user to use the page function.

## API

| Param | Description | Type | Default value |
| --- | --- | --- | --- |
| title | custom title text | ReactNode | - |
| subTitle | custom subTitle text | ReactNode | - |
| backIcon | custom back icon, if false the back icon will not be displayed | ReactNode | `<Icon type="arrow-left" />` |
| tags | Tag list next to title | [Tag](https://ant.design/components/tag-cn/)[] \| [Tag](https://ant.design/components/tag-cn/) | - |
| extra | Operating area, at the end of the line of the title line | ReactNode | - |
| breadcrumb | breadcrumb config | [breadcrumb](https://ant.design/components/breadcrumb-cn/) | - |
| footer | PageHeader's footer, generally used to render TabBar | ReactNode | - |
| onBack | back icon click event | `()=>void` | `()=>history.back()` |
New Component PageHeader (#13637) * add api dock * add a simple demo * add content demos * fix style warning * Replace content with children * add all demo * add demo test * add backNode props * Adjust the divider style * fix icon do no show * fix test ci * fix md code style * remove fragment use * add test script * Missing newline character at end of file * optimize the demo display * text becomes longer * text becomes longer * fix css code style * fix test snapshot * fix css code style * fix codereivew waring * fix codereivew waring * update snapshots * use ant-page-header-have-footer * use englist * fix typo * updated snapshot * line-height set to 100% * remove subtitle * Specification less * fix less style error * Sort by alphabet * Rebuild code * use english * number use Statistic * snapshot updated * rm onBack in breadcrumb * remove unuse return * add a click wave * remove unuse css * add icon hover * newline character * new description * warm descriptive text * add dot * remove async * feat: use Typography.Paragraph * test: snapshots updated * style: fix style lint * import typography style 6 years ago			`---`
			`category: Components`
			`type: Navigation`
			`title: PageHeader`
			`cols: 1`
			`subtitle:`
			`---`

			`The header can be used to declare the page topic, display important information about the page that the user is interested in, and carry the action items related to the current page (including page-level operations, inter-page navigation, etc.)`

			`## When To Use`

			`It can also be used as inter-page navigation when it is needed to make the user quickly understand what the current page is and to facilitate the user to use the page function.`

			`## API`

			`\| Param \| Description \| Type \| Default value \|`
:lipstick: prittier all files 6 years ago			`\| --- \| --- \| --- \| --- \|`
New Component PageHeader (#13637) * add api dock * add a simple demo * add content demos * fix style warning * Replace content with children * add all demo * add demo test * add backNode props * Adjust the divider style * fix icon do no show * fix test ci * fix md code style * remove fragment use * add test script * Missing newline character at end of file * optimize the demo display * text becomes longer * text becomes longer * fix css code style * fix test snapshot * fix css code style * fix codereivew waring * fix codereivew waring * update snapshots * use ant-page-header-have-footer * use englist * fix typo * updated snapshot * line-height set to 100% * remove subtitle * Specification less * fix less style error * Sort by alphabet * Rebuild code * use english * number use Statistic * snapshot updated * rm onBack in breadcrumb * remove unuse return * add a click wave * remove unuse css * add icon hover * newline character * new description * warm descriptive text * add dot * remove async * feat: use Typography.Paragraph * test: snapshots updated * style: fix style lint * import typography style 6 years ago			`\| title \| custom title text \| ReactNode \| - \|`
			`\| subTitle \| custom subTitle text \| ReactNode \| - \|`
			\| backIcon \| custom back icon, if false the back icon will not be displayed \| ReactNode \| `<Icon type="arrow-left" />` \|
			`\| tags \| Tag list next to title \| [Tag](https://ant.design/components/tag-cn/)[] \\| [Tag](https://ant.design/components/tag-cn/) \| - \|`
			`\| extra \| Operating area, at the end of the line of the title line \| ReactNode \| - \|`
:lipstick: prittier all files 6 years ago			`\| breadcrumb \| breadcrumb config \| [breadcrumb](https://ant.design/components/breadcrumb-cn/) \| - \|`
			`\| footer \| PageHeader's footer, generally used to render TabBar \| ReactNode \| - \|`
New Component PageHeader (#13637) * add api dock * add a simple demo * add content demos * fix style warning * Replace content with children * add all demo * add demo test * add backNode props * Adjust the divider style * fix icon do no show * fix test ci * fix md code style * remove fragment use * add test script * Missing newline character at end of file * optimize the demo display * text becomes longer * text becomes longer * fix css code style * fix test snapshot * fix css code style * fix codereivew waring * fix codereivew waring * update snapshots * use ant-page-header-have-footer * use englist * fix typo * updated snapshot * line-height set to 100% * remove subtitle * Specification less * fix less style error * Sort by alphabet * Rebuild code * use english * number use Statistic * snapshot updated * rm onBack in breadcrumb * remove unuse return * add a click wave * remove unuse css * add icon hover * newline character * new description * warm descriptive text * add dot * remove async * feat: use Typography.Paragraph * test: snapshots updated * style: fix style lint * import typography style 6 years ago			\| onBack \| back icon click event \| `()=>void` \| `()=>history.back()` \|