如何在容器内定位文本？答案

【问题标题】：How do I position text inside a container?如何在容器内定位文本？
【发布时间】：2015-06-17 19:49:02
【问题描述】：

我创建了一个 div 类容器，但是当我输入文本时，它出现在容器的中间。如何将文本与容器的左上角对齐？

顺便说一句，我使用了位置：相对，上 0px 左 0px。但是，这会将其移动到浏览器页面的角落，而不是容器的角落。

【问题讨论】：

我能想到它移动到窗口的唯一原因是因为 CSS 具有位置：绝对，为了使用绝对，您需要有一个具有位置的父容器：相对.一个好的建议是不要使用任何位置属性，除非真的有必要。在大多数情况下，情况并非如此。此外，正如人们所说，除非另有说明，否则文本位于左上角。

标签： html css

【解决方案1】：

您可能使用了 text-align: center;因为您没有向我们提供必要的信息来帮助您，所以无法确定。

如果它是表单中的提交按钮，并且您在 value="" 中输入了文本，它会自动将您的文本居中，标签之间称为按钮的标签也是如此。

请制作codepen按下笔按钮，并复制相关代码，并将您的笔的链接提供给我们。

当你在你的盒子中使用绝对位置时，你需要一些东西来相对于它。因此，添加一个相对于您的框的位置，以及一个相对于您的文本的绝对位置。

但是我建议你使用 line-height: "height of your box"px;和 padding-left: 5px 例如，如果它是一个按钮，则在框中对齐文本。记得使用 box-sizing:border-box;这允许您在不展开框的情况下使用填充。

【讨论】：

【解决方案2】：

文本居中对齐的方式有很多种，你可能使用了标签，或者你的容器被强行移到了中心，将容器移到中间的正确方法是margin： 0 自动；。您必须提供您正在使用的 html 和 css 代码。

【讨论】：

【解决方案3】：

可以使用

更改文本的对齐方式

margin-left:-1%;
margin-top:-1%;
float: left;

【讨论】：

【解决方案4】：

<div class="container text-center"> </div>

【讨论】：