极客观点
项目管理
HarmonyOS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<style>
.ww{
display: flex;
width: 1540px;
}
.a1,.a3{
flex:1;
}
.a2{
width: 600px;
text-align: center;
}
</style>
<div class="ww">
<div class="a1">asdasdasd</div>
<div class="a2">ssssssssssss</div>
<div class="a3">sssss</div>
</div>
</body>
</html>a2 是否是对于 ww 居中的吗？
首先要说明一个点
text-align: center;这个是对当前元素的内联元素，也就是你现在的那一堆 ssssssssssss 的内容进行居中，且只是对于.a2这个div容器进行居中。借用 MDN 上的一句话:
再回到问题上，就目前来看，问题应该是：
我的理解就是，你想让你
a2相对于ww做居中处理，那么这个时候你要考虑的是在 flex 布局时，如何让元素居中。在
ww设置为display: flex之后，其三个子元素都是 flex 元素，那么就具备了 flex 元素的可伸缩的特性，并且你也对.a1和.a3设置了flex: 1;，这个时候就算你的.a2设置width: 600px;，在特定情况下，还是会被挤压的。比如
.a1的内容是连续的单字节字符，就像这样：而如果不是这样的情况，那么你的这个样式写法，看着感觉的确是已经满足
.a2居中于.ww了。