W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <head> <style> #container { width: 60%; height: 200px; border: solid black 1px; display: flex; flex-wrap: wrap; place-items: stretch end; } #container > div { padding: 30px; margin: 2px; background-color: coral; } </style> </head> <body> <h1>flexbox 中的 place-items 属性</h1> <p>justify-items 属性在 flexbox 布局中不适用。因此，当在 flexbox 布局中使用 place-items 属性时，justify-items 的值（第二个值）会被忽略。在这种情况下，'stretch' 作为 align-items 的属性值起作用，但 'end' 作为 justify-items 的属性值没有任何效果。</p> <div id="container"> <div></div> <div></div> <div></div> <div></div> </div> </body> </html>