1# stack 2<!--Kit: ArkUI--> 3<!--Subsystem: ArkUI--> 4<!--Owner: @lanshouren--> 5<!--Designer: @lanshouren--> 6<!--Tester: @liuli0427--> 7<!--Adviser: @HelloCrease--> 8 9 10堆叠容器,子组件按照顺序依次入栈,后一个子组件覆盖前一个子组件。 11 12> **说明:** 13> 14>从API Version 8 开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 15 16 17## 子组件 18 19支持。 20 21 22## 属性 23 24支持[通用属性](js-service-widget-common-attributes.md)。 25 26 27## 样式 28 29支持[通用样式](js-service-widget-common-styles.md)。 30 31 32## 事件 33 34支持[通用事件](js-service-widget-common-events.md)。 35 36 37## 示例 38 39 40```html 41<!-- xxx.hml --> 42<stack class="stack-parent"> 43 <div class="back-child bd-radius"></div> 44 <div class="positioned-child bd-radius"></div> 45 <div class="front-child bd-radius"></div> 46</stack> 47``` 48 49 50```css 51/* xxx.css */ 52.stack-parent { 53 width: 400px; 54 height: 400px; 55 margin: 50px; 56 background-color: #ffffff; 57 border-width: 1px; 58 border-style: solid; 59} 60.back-child { 61 width: 300px; 62 height: 300px; 63 background-color: #3f56ea; 64} 65.front-child { 66 width: 100px; 67 height: 100px; 68 background-color: #00bfc9; 69} 70.positioned-child { 71 width: 100px; 72 height: 100px; 73 left: 50px; 74 top: 50px; 75 background-color: #47cc47; 76} 77.bd-radius { 78 border-radius: 16px; 79} 80``` 81**4*4卡片** 82 83 84 85