Html 水平居中伸缩件

是否可以在没有位置的情况下水平居中

.div2

绝对/固定，如下图所示

div3可以改变宽度

这是我的密码：

正文{
保证金：0；
}
.测试{
背景：绿色；
颜色：#fff；
显示器：flex；
}
.测试1{
}
.测试2{
保证金：0自动；
背景：红色；
}
.测试3{
保证金：0自动；
}

左选项
中心分区
用户名：test（字符串可以更改）

为父元素提供显示灵活性。然后，

justify contents

将子对象在主轴上对齐，“align items”将子对象垂直对齐
获取更多详细信息

左选项
中心分区
用户名：test（字符串可以更改）
.测试{
显示器：flex；
证明内容：之间的空间；
对齐项目：居中；
高度：50px；
}

您可以为所有div指定33.3333%的宽度

.test{
背景：绿色；
颜色：#fff；
显示器：flex；
}
.测试1{
宽度：33.3333%；
}
.测试2{
保证金：0自动；
背景：红色；
宽度：33.3333%；
}
.测试3{
保证金：0自动；
宽度：33.3333%；
}

左选项
中心分区
用户名：test（字符串可以更改）

使用

显示：flex

样式属性，如下所示

正文{
保证金：0；
}
.测试{
背景：绿色；
颜色：#fff；
显示器：flex；
}
.测试组{
弹性：1；
显示器：flex；
证明内容：中心；
对齐项目：居中；
边框：1px实心#ccc；
背景颜色：绿色；
高度：50px；
}

左选项
中心分区
用户名：test（字符串可以更改）

浮动：左

到

中的所有
div
s。test

就可以了

.test>div{float:left;}

如果您希望

div

s占据整个宽度，则将

width的宽度设置为33.3333%（编号为
div
/100）

我认为您希望div2保持其大小，而div1和div3元素会不断增长，直到它们接触到它为止。将这些元素的弹性基础设置为0：


正文{
保证金：0；
}
.测试{
背景：绿色；
颜色：#fff；
显示器：flex；
}
.测试2{
背景：红色；
}
.测试1，
.测试3{
弹性基准：0；
柔性生长：1；
}
.第3分部{
文本对齐：右对齐；
}

左选项
中心分区
用户名：test（字符串可以更改）
请参见方框71，解决方案2：
.test>div{float:left;}