设置文本垂直位置当文本是水平中心（文本 - 排序：中心）

我见过很多问题，并回答如何居中垂直和水平文本。我的问题是如何改变文字的中心水平时的垂直位置？我不想将它居中放置，也许只有几个像素以下。我试过top：xx％;不起作用。我还有什么遗漏？设置文本垂直位置当文本是水平中心（文本 - 排序：中心）

CSS

p{ 
    color: #7C7C7C; 
    text-align: center; 
}

来源

2017-06-15 Luke

'我的问题是如何更改文本时，它的中心水平的垂直位置？我不想将它居中放置。你的意思是你想要水平居中？ –

可以使用例如边距：??像素;

来源

2017-06-15 15:58:36

是的，但我有几条文字线，我想将它们放在中心水平线上，而另一条线则放在另一个的下面，而没有太多空间。如果我使用margin-top，我会将第一行设置为我想要的位置，例如margin-top 100px，但下一行将距第一行100px。 – Luke

没关系固定它:)，只是不得不添加一个带边缘顶部？px的div作为所有文本作为一个组 – Luke

文本在div容器中，您可以使用填充顶部:-) – 2017-06-17 08:50:00

使用div来包装您的文字。

<div style="background: green; width 150px; height: 60px; text-align:center"> 
 
    <p>Abcd 
 
</div>

来源

2017-06-15 15:59:58

在使用平移Y属性中心

对齐如图中下面片段

<head> 
 
    <style> 
 
     p{ 
 
     text-align:center; 
 
     transform:translateY(50vh); 
 
     } 
 
    </style> 
 
    </head> 
 

 
    <body> 
 
    <p>Center</p> 
 
    </body>

来源

2017-06-15 16:16:16

CSS如果使用相对位置top属性将移动元件。或者，您可以使用padding-top或margin-top。

p { 
    position:relative; 
    top: 10px; 
}

或

p { 
    padding-top:10px; 
}

box model reference for padding and margin和 position reference

来源

2017-06-15 17:47:27

但是，不会中心文本水平。我有几行文字，我希望它是中心水平，并稍微垂直移动。 – Luke

设置文本垂直位置当文本是水平中心（文本 - 排序：中心）

回答

相关问题