要实现“姓名：张三 李四 王二麻”这种垂直排列的网页布局，可以使用CSS的Flexbox布局模型。Flexbox非常适合用于创建一维布局，无论是水平还是垂直方向。
以下是一个简单的示例代码，展示如何使用Flexbox实现垂直排列的布局：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>垂直排列布局</title>
<style>
.container {
display: flex;
flex-direction: column; /* 设置主轴方向为垂直方向 */
align-items: flex-start; /* 左对齐 */
gap: 10px; /* 设置子元素之间的间距 */
}
.name {
font-size: 16px;
color: #333;
}
</style>
</head>
<body>
<div class="container">
<div class="name">姓名：张三</div>
<div class="name">李四</div>
<div class="name">王二麻</div>
</div>
</body>
</html>
display: flex;: 将容器设置为Flexbox布局。flex-direction: column;: 设置主轴方向为垂直方向，使得子元素垂直排列。align-items: flex-start;: 设置子元素在交叉轴（水平方向）上左对齐。gap: 10px;: 设置子元素之间的间距为10px。align-items设置为center。justify-content设置为center。通过这种方式，你可以轻松地使用Flexbox实现垂直排列的布局。