Question

是否有任何CSS语法在页面的中心点开始一段文字？我知道我可以使用text-align：center到center文本，但是如何将文本的第一个字符放在页面中间？

Answer 1

<div id="left"></div>
    <div id="right">SomeText</div>

#left
{
 width:50%;
 float:left;   
}

#right
{
 width:50%;
 float:right;   
}

http://jsfiddle.net/ktCb8/43/

Answer 2

为什么不使用如下所示的非常简单的东西：

<div style="padding-left:50%">
   Test Test
</div>

这将确保文本始终在元素中间启动。

Answer 3

您可以将元素居中（使用width和margin: auto;），然后使用：

text-indent: 50%;

...在中心点开始文本的第一行。

请记住，50%是父元素宽度的百分之五十，所以：

div {
    width: 50%;
    margin: 0 auto;
    text-indent: 25%;
    background-color: #ffa;
}

width的{{1}}是div元素的50%，因此body是25%的一半。< / p>

JS Fiddle demo

如果您希望文本与宽度的50％处的点对齐，则只需使用包含文本的元素的div：

margin

JS Fiddle demo

Answer 4

我有个主意..

尝试使用以下css创建一个主包装器div：

.wrapper_div {
    margin-left:auto;
    margin-right:auto;
    width: 500px;

}

然后在包装器div内部的一个子区域，宽度为250px并向右浮动。 div中的文本应该有text-align：left

（或使包装器位置相对，子div宽度为50％）

Answer 5

<div style="padding-left:10em; padding-right:10em;">
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cum, est 
    provident omnis debitis, qui ad tenetur quo cumque eligendi quas nam fuga 
    sequi temporibus error accusamus aliquid quisquam animi ipsa?</p>
</div>

Answer 6

p.start-from-middle {
  padding-left: 50%;
  width: 50%;
  text-align: left;
  display: block;
}

<p class="start-from-middle">Your text</p>

在页面的中心点开始文本（CSS，HTML）

6 个答案: