在 CSS 中定位文本 [关闭]答案

【问题标题】：Positioning Text in CSS [closed]在 CSS 中定位文本 [关闭]
【发布时间】：2022-01-25 05:55:00
【问题描述】：

我有一个问题。我正在创建一个网站。所以我希望这个文本在照片的画边框中移动。我怎样才能做到这一点？注意：对不起，我用词不当。

【问题讨论】：

你能提供你当前的html和css代码吗？
@SaddamHabibie 是的，我可以。我缩小了文本的边框，但无法将其移到中心。这是 CSS 代码：css .PoemsBoi article { margin: 20px; box-sizing: border-box; width: 450px; height: 350px; padding: 20px; border: 4px solid black; border-radius: 6px; justify-content: center; color: rgb(155, 112, 19); }
您是否希望所有文本在框中也居中对齐？

【解决方案1】：

我不确定，但我认为下面的代码就是你要找的。p>

.box{
  text-align:center;
  border:2px solid;
  width:60%;
  margin:auto;
  padding:5px; /*optional*/
}

<div class="box">
  <h3>Lorem ipsum dolor sit amet</h3>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porta nisi nec lacus interdum maximus. Suspendisse pharetra consectetur mauris sit amet dignissim. Vivamus in dolor ac eros sagittis volutpat vel et massa. Morbi lectus nunc, pretium vel pellentesque quis, pharetra vitae neque. Vivamus nisi mi, dapibus sed ex in, ornare pharetra lorem.</p>
  <h3>Nam malesuada augue quis ex tempor gravida.</h3>
  <p>Nam malesuada augue quis ex tempor gravida. Duis id vulputate eros. Nunc vehicula lacus et varius mollis. Nunc ligula nunc, porta at varius id, scelerisque sed quam. Praesent sollicitudin posuere tristique. Aenean tempus, risus sit amet consectetur bibendum, libero diam euismod tellus, at semper arcu libero in neque. Duis erat enim, euismod nec nunc sed, molestie sagittis dui.</p>
  <h3>Mauris iaculis neque at iaculis accumsan.</h3>
  <p>Mauris iaculis neque at iaculis accumsan. Curabitur volutpat odio a quam tristique rutrum a vitae purus. Praesent congue lorem a justo tempor venenatis. Donec suscipit tincidunt rutrum. Pellentesque fermentum massa odio, eget posuere massa consectetur id. Suspendisse sagittis dolor in ultricies venenatis. Nulla eget aliquet quam. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
</div>

【讨论】：

【解决方案2】：

此代码将允许您在页面中心显示文本。

.PoemsBoi article {
    display:block;
    width:100%;
    text-align:center;
}

【讨论】：