1# stack 2 3The **\<stack>** component provides a stack container where child components are successively stacked and the latter one overwrites the previous one. 4 5## Required Permissions 6 7None 8 9## Child Components 10 11Supported 12 13## Attributes 14 15Attributes in [Universal Attributes](js-components-common-attributes.md) are supported. 16 17## Styles 18 19Styles in [Universal Styles](js-components-common-styles.md) are supported. 20 21## Events 22 23Events in [Universal Events](js-components-common-events.md) are supported. 24 25## Methods 26 27Methods in [Universal Methods](js-components-common-methods.md) are supported. 28 29## Example 30 31``` 32<!-- xxx.hml --> 33<stack class="stack-parent"> 34 <div class="back-child bd-radius"></div> 35 <div class="positioned-child bd-radius"></div> 36 <div class="front-child bd-radius"></div> 37</stack> 38/* xxx.css */ 39.stack-parent { 40 width: 400px; 41 height: 400px; 42 background-color: #ffffff; 43 border-width: 1px; 44 border-style: solid; 45} 46.back-child { 47 width: 300px; 48 height: 300px; 49 background-color: #3f56ea; 50} 51.front-child { 52 width: 100px; 53 height: 100px; 54 background-color: #00bfc9; 55} 56.positioned-child { 57 width: 100px; 58 height: 100px; 59 left: 50px; 60 top: 50px; 61 background-color: #47cc47; 62} 63.bd-radius { 64 border-radius: 16px; 65} 66``` 67 68