如何在CSS中已经在父类中设置了text-align：center属性，应该在div中的所有文字和图片都会水平居中？

在CSS中已经在父类中设置了text-align：center属性，应该在div中的所有文字和图片都会水平居中，但效果只有左右居中，到底是哪里出了问题？

flex布局，给容.goods添加下面的样式实现水平垂直居中
display: flex; justify-content: center;flex-direction: column;align-items: center

<style>
    .goods {
        width: 234px;
        height: 300px;
        background: pink;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center
    }
    .goods img{width:80%}
</style>
<div class="goods">
    <img src="https://2d.zol-img.com.cn/product/192_220x165/653/ceILemOn2bN6.jpg" />
    <div>九号平衡车</div>
    <div>陈年人的玩具</div>
    <div>1999元</div>
</div>

水平居中没问题，垂直居中要用另外的方式实现。

vertical-align ：middle

为父元素添加一个line-height等于div的高度

https://blog.csdn.net/weixin_45944877/article/details/119581116

我怀疑你是想要水平居中并且垂直居中，你可以给父节点设置一个 line-height 或者使用flex 布局（简单省事）

垂直居中需要用别的方法。
flex

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632