---
order: 6
iframe: 360
title:
zh-CN: 固定头部
en-US: Fixed Header
---
## zh-CN
一般用于固定顶部导航,方便页面切换。
## en-US
Fixed Header is generally used to fix the top navigation to facilitate page switching.
```tsx
import { Layout, Menu, Breadcrumb } from 'antd';
const { Header, Content, Footer } = Layout;
ReactDOM.render(
Home
List
App
Content
,
mountNode,
);
```
```css
#components-layout-demo-fixed .logo {
float: left;
width: 120px;
height: 31px;
margin: 16px 24px 16px 0;
background: rgba(255, 255, 255, 0.2);
}
.site-layout .site-layout-background {
background: #fff;
}
```