如何垂直对齐段落中的文本？ [英] How do I vertically align text in a paragraph?

问题描述

我想知道如何将 p 元素中的文本对齐为垂直居中。

这里是我的风格：

  p.event_desc {
字体：bold 12pxHelvetica Neue，Helvetica，Arial，sans -serif; 
 line-height：14px; 
 height：35px; 
 margin：0px; 
} 
  

和HTML：

 < p class =event_desc> Lorem ipsum。< / p> 
  

解决方案

试试这些样式：

  p.event_desc {font：bold 12pxHelvetica Neue，Helvetica，Arial，sans-serif; line-height：14px;高度：960x75像素; margin：0px; display：table-cell; vertical-align：middle;填充：10px; border：1px solid＃f00;}  

< p class =event_desc> lorem ipsum< / p>

I would like to know to align the text in a p element to be vertically centered.

Here are my styles:

p.event_desc {
 font: bold 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
 line-height: 14px;
 height: 35px;
 margin: 0px;
}

and HTML:

<p class="event_desc">Lorem ipsum.</p>

解决方案

Try these styles:

p.event_desc {
  font: bold 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 14px;
  height:75px;
  margin: 0px;
  display: table-cell;
  vertical-align: middle;
  padding: 10px;
  border: 1px solid #f00;
}

<p class="event_desc">lorem ipsum</p>

这篇关于如何垂直对齐段落中的文本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！