0

根据官方提供的例子：

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>Full Width, Header, Menu, Footer</title>
    <link rel="stylesheet" href="../bower_components/angular-material/angular-material.css">
  </head>
  <body layout="column" layout-fill>
    <header>Header</header>
    <div flex layout="row" layout-phone="column">
      <aside flex-sm="33" flex-md="20">
        Menu <br>[flex-sm="33"][flex-md="20"]
      </aside>
      <main flex>Main [flex]</main>
    </div>
    <footer>Footer</footer>
  </body>
</html>

只是使用 css as angular-material.css，但显示错误！

4

1 回答 1

1

确保您使用的是最新版本，因为文档仅显示最新版本的文档。因此，现在您可能会看到 0.6.0rc1 的文档，其中有几个从 0.5.1 开始的重大更改/重命名，请参阅更改日志以进行修复。

如果你想要一个带有侧边菜单和页脚的全宽页眉，这里是 0.6.0rc1 的正确标记

<div layout="column" layout-fill>
    <div layout="row">
        <span>Your header</span>
    </div>
    <div layout="row" flex>
        <div layout="column" flex="33">
            Sidebar
        </div>
        <div flex="66">
            Main content
        </div>
    </div>
    <div layout="row">
        The footer!
    </div>
</div>

这只是一个基本布局，您可能会md-tollbar用md-sidenav. 但这应该可以帮助您。

此外，如果你想使用 0.5.1 仍然只是row用horizontal和column替换vertical

于 2014-11-22T04:35:33.260 回答