垂直元素均匀分布
实现垂直元素的均匀分布，如果只有一个元素则在最上方。
主要使用flex:1使空间均分。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Flexbox Equal Width Divs</title><style>.container {display: flex;flex-direction: column;justify-content: space-between; /* 可选：在子元素之间添加间距 */gap: 10px; /* 可选：在子元素之间添加固定间距 */}.container > div {flex: 1; /* 每个子元素平摊可用空间 */padding: 20px;background-color: lightblue;text-align: center;}</style>
</head>
<body><div class="container"><div>Div 1</div><div>Div 2</div><div>Div 3</div><div>Div 4</div>
</div></body>
</html>