运行 ❯
获取你
自己的
网站
×
更改方向
保存代码
更改主题,深色/浅色
前往 Spaces
<!DOCTYPE html> <html> <head> <style> #container { height: 350px; width: 60%; border: solid black 1px; display: flex; flex-wrap: wrap; place-content: end space-between; } #container > div { flex-basis: 40px; height: 40px; margin: 2px; background-color: coral; } </style> </head> <body> <h1>The place-content Property</h1> <p>Resize window to see the effect more clearly. The flex lines are placed at the bottom of the container in the column direction, and the flex items are aligned with the same space between them in the row direction.</p> <div id="container"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> </body> </html>