如何使<p>和<span>在HTML 5中具有相同的行高？</span> </p>

Question

如何让p和span在HTML 5中具有相同的行高？

.main-body-text {
  color: #666;
  font-size: 10px;
  font-family: robotolight, sans-serif;
  text-align: left;
  line-height: 14px;
}

JS Fiddle

Answer 1

问题是p和span具有不同的display类型，由于行之间隐藏的空格而导致不同的行为。

如果您希望它们都具有相同的line-height，请强制它们属于同一类型：

display:inline; // or 'block' or 'inline-block'

JSFiddle demo