angularjs材质布局,弹性和偏移

ask*_*007 6 css flexbox angularjs angular-material

1)我试图将儿童div扩展到60%并将其对齐在中心,但它不起作用.我使用flex来将div的大小拉伸到60%.请参阅示例http://plnkr.co/edit/eaLjJDbjL1KnOI4jLYyO?p=preview

<div layout="column" layout-align="center">
<div style="background-color:#00A000;height: 40px;" flex="60">

</div>

<div style="background-color:#004444;height: 40px;" flex="60">

</div>

<div style="background-color:#0077b3;height: 40px;" flex="60">

</div>
Run Code Online (Sandbox Code Playgroud)

2)在Angularjs Material文档中,提到"为了自定义布局中元素的大小和位置,使用flex,offset和flex-order属性",我没有看到偏移的示例.

nit*_*tin 17

这是你需要做的..

<div layout="column" layout-align="center">
    <div layout="row" layout-align="center center">
      <div style="background-color:#00A000;height: 40px;" flex="60">
      </div>  
    </div>
    <div layout="row" layout-align="center center">
      <div style="background-color:#004444;height: 40px;" flex="60">
      </div>
    </div>
    <div layout="row" layout-align="center center">
      <div style="background-color:#0077b3;height: 40px;" flex="60">
      </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

阅读更多关于布局的信息