布局

预览

使用方法

  <div class="wrapper">
    <m-layout>
      <m-header> header </m-header>
      <m-layout>
        <m-smder> smder </m-smder>
        <m-content> content </m-content>
      </m-layout>
      <m-footer> footer </m-footer>
    </m-layout>
    <m-layout>
      <m-header> header </m-header>
      <m-content> content </m-content>
      <m-footer> footer </m-footer>
    </m-layout>
    <m-layout>
      <m-header> header </m-header>
      <m-layout>
        <m-sider> sider </m-sider>
        <m-layout>
          <m-content> content </m-content>
          <m-footer> footer </m-footer>
        </m-layout>
      </m-layout>
    </m-layout>
  </div>

选项

提供基础布局，样式自定义。

组件概述

• m-layout ：布局容器，其下可嵌套 Header Sider Content Footer 或 Layout 本身，可以放在任何父容器中。

• m-header ：顶部布局，其下可嵌套任何元素，只能放在 Layout 中。

• m-sider ：侧边栏，其下可嵌套任何元素，只能放在 Layout 中。

• m-content ：内容部分，其下可嵌套任何元素，只能放在 Layout 中。

• m-footer ：底部布局，其下可嵌套任何元素，只能放在 Layout 中。