如何在html / css中的图片旁边垂直居中放置文字？
垂直居中html图像旁边的文本的最佳和最简单的方法是什么？需要与浏览器版本/类型无关。纯HTML / CSS解决方案。
问题答案：
我总是退回到这个解决方案上。不太hack-ish并完成工作。
编辑：我应该指出，您可以使用以下代码来实现想要的效果（原谅内联样式；它们应该在单独的工作表中）。图像（基线）上的默认对齐方式似乎会导致文本对齐基线。至少在FireFox3中，将其设置为中值可以使事物很好地呈现。
<div>
<img src="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.svg" style="vertical-align: middle;" width="100px"/>
<span style="vertical-align: middle;">Here is some text.</span>
</div>
-
问题内容： 我有这样的标记： div高于img： 我需要将图像放置在div的中间（在其上下具有相同的空白）。 我试过了，它不起作用： 问题答案： 如果您的图像纯粹是装饰性的，那么将其用作背景图像可能是一种更语义化的解决方案。然后您可以指定背景的位置 如果它不是装饰性的并且构成有价值的信息，则img标签是合理的。在这种情况下，您需要使用以下属性设置包含div的样式：
-
问题内容： 为什么不行？但是， 确实 可以。 问题答案： 实际上，在这种情况下，这非常简单：对图像应用垂直对齐。由于所有内容都在同一行中，因此它实际上是要对齐的图像，而不是文本。 在FF3中测试。 现在，您可以将flexbox用于这种类型的布局。
-
问题内容： 我怎么能垂直居中内的？ 到目前为止，我的代码： 我已经尝试过“ top：50％”；和“ vertical-align：middle”；没有成功 编辑： 好的，所以已经讨论了很多。我也许已经开始了另一场小型的火焰战争。但是为了论证，那我该如何用一个表呢？到目前为止，我已经将CSS用于其他所有内容，所以这并不是说我没有尝试采用“良好做法”。 编辑： 内部div没有固定的高度 问题答案： 简
-
本文向大家介绍CSS图片响应式 垂直水平居中，包括了CSS图片响应式 垂直水平居中的使用技巧和注意事项，需要的朋友参考一下 我看最近微博流行CSS居中技术，我看了几编资料写的都不多好，于是抽时间把相关资料整合了，具体内容如下。 点击此处下载源码 效果展示： 要求: 1.尽可能兼容更多浏览器，这里兼容到ie7,ie6不支持max-*就不考虑了。 2.浏览器尺寸变化时，图片总是等比例拉伸或缩放。 3.
-
问题内容： 我正在使用的div是父div高度的100％。 div仅包含一行文本。 div不能具有固定的高度。 所以我的问题是。 如何垂直对齐文本行？ 我试过使用： 如果很重要，则div是绝对定位的。 当前的CSS 问题答案： 这个答案不再是最好的答案…请参阅下面的flexbox答案！ 为了使其完全居中（如大卫的回答中所述），您需要添加负的上边距。如果您知道（或强制）只有一行文本，则可以使用： 例如
-
问题内容： 无论div元素有多高，我如何在h1标签内垂直居中放置h1标签？即如果用户更改他的浏览器高度，我希望h1根据新的高度在中心垂直对齐。 谢谢。 问题答案： 我遇到过的最好的解决方案是利用属性并将wrapper元素设置为，以允许对元素的使用居中： HTML CSS 经过测试 Windows XP Professional 2002版Service Pack 3 Internet Explor