From 00aa253a26fa348a45ebda0e2bf80cb9ea2d5673 Mon Sep 17 00:00:00 2001
From: ddcat1115 <ddcat1115@gmail.com>
Date: Sun, 5 Mar 2017 20:02:53 +0800
Subject: [PATCH] add fixed-header demo for Layout (#5119)

---
 components/layout/demo/fixed.md | 68 +++++++++++++++++++++++++++++++++
 1 file changed, 68 insertions(+)
 create mode 100644 components/layout/demo/fixed.md

diff --git a/components/layout/demo/fixed.md b/components/layout/demo/fixed.md
new file mode 100644
index 000000000..a3b601951
--- /dev/null
+++ b/components/layout/demo/fixed.md
@@ -0,0 +1,68 @@
+---
+order: 6
+iframe: true
+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.
+
+````jsx
+import { Layout, Menu, Breadcrumb } from 'antd';
+const { Header, Content, Footer } = Layout;
+
+ReactDOM.render(
+  <Layout>
+    <Header className="header">
+      <div className="logo" />
+      <Menu
+        theme="dark"
+        mode="horizontal"
+        defaultSelectedKeys={['2']}
+        style={{ lineHeight: '64px' }}
+      >
+        <Menu.Item key="1">nav 1</Menu.Item>
+        <Menu.Item key="2">nav 2</Menu.Item>
+        <Menu.Item key="3">nav 3</Menu.Item>
+      </Menu>
+    </Header>
+    <Content className="content">
+      <Breadcrumb style={{ margin: '12px 0' }}>
+        <Breadcrumb.Item>Home</Breadcrumb.Item>
+        <Breadcrumb.Item>List</Breadcrumb.Item>
+        <Breadcrumb.Item>App</Breadcrumb.Item>
+      </Breadcrumb>
+      <div style={{ background: '#fff', padding: 24, minHeight: 280 }}>Content</div>
+    </Content>
+    <Footer style={{ textAlign: 'center' }}>
+      Ant Design ©2016 Created by Ant UED
+    </Footer>
+  </Layout>
+, mountNode);
+````
+
+````css
+#components-layout-demo-fixed .logo {
+  width: 120px;
+  height: 31px;
+  background: #333;
+  border-radius: 6px;
+  margin: 16px 24px 16px 0;
+  float: left;
+}
+#components-layout-demo-fixed .header {
+  position: fixed;
+  width: 100%;
+}
+#components-layout-demo-fixed .content {
+  padding: 0 50px;
+  margin-top: 64px;
+}
+````