我尝试了align-self-center和my-auto，但不能居中这些h3和p标签。我的错在哪里？“
null
<div class="container production">
<div class="row">
<div class="col-md-10 offset-md-1 col-12">
<h2>xxxxxxxxxxxxxxxxxx</h2>
<div class="row production-row">
<div class="col-md-6">
<img src="{{ asset('images/picture.png') }}" class="img-fluid"alt="">
</div>
<div class="col-md-6">
<div class="align-self-center">
<h3>aaaaaaaaaaaaaaaaaaaaaaaaaaaa</h3>
<p>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
</div>
</div>
</div>null
使用此选项:
<div class="col-md-6">
<div class="text-center">
<h3>aaaaaaaaaaaaaaaaaaaaaaaaaaaa</h3>
<p class="text-break">bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</p>
</div>
</div>
根据您提交的代码，text-align:center适用于您的h3和p标签。你在用bootstrap吗？如果您是，您可以使用类文本中心而不是对齐自中心（align-self-center
null
h3, p{
text-align:center;
}<link href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container production">
<div class="row">
<div class="col-md-10 offset-md-1 col-12">
<h2>xxxxxxxxxxxxxxxxxx</h2>
<div class="row production-row">
<div class="col-md-6">
<img src="https://via.placeholder.com/150" class="img-fluid"alt="">
</div>
<div class="col-md-6">
<div class="align-self-center">
<h3>aaaaaaaaa</h3>
<p>bbbbbbbbbbbbbbbbbb</p>
</div>
</div>
</div>
您也可以直接使用引导类将h3和p元素居中对齐，使用类名为align-items-center
