html - 之间的线高标签不一样

Question

我正在尝试制作一个简单的主页，但我的行高略有不同

标签。这是 HTML `

贾斯汀是首席工程师

        <p>and also this &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp and Justin also  </p> 
            <a href="http://brabble.com"><img id="brabble" src="img/brabble.png"></a>

        <p>to make products work </p>`

这是一张图片

Answer 1

您的图像妨碍了文本格式，因为它与您的文本大小不同。你有几个选择，最有效的是将图像放在它自己的跨度中，并给该跨度一个明确的高度 1em，并带有溢出：可见：

<P>lalalala <span class='imagewrapper'><img ....></span> more text</p>

风格：

.imagewrapper {
  display: inline-block;
  height: 1em;
  overflow: visible;
}

见http://jsfiddle.net/UG5us/

Answer 2

该图像使行框变得比周围元素的行高指定的高。为避免这种情况，请缩小图像和/或设置其垂直位置。