如何垂直对齐div的文本和图像中间?

用户5773634

这是我博客徽标的一部分。我在div内有徽标图像和文字。现在,图像在中间对齐,但文本不在div的中间。我如何在不使用边距的情况下做到这一点?这是我的代码:

<head>
<style type="text/css">
  #titleimage {
    background: red;
    display: inline-block;
  }
  #titleimage a {
    text-decoration: none;
  }
  #titleimage img {
    width: 33px;
    height: 36px;
    vertical-align: middle;
  }
  #titleimage span {
    color: white;
    font-family: sans-serif;
    font-size: 26px;
  }
</style>
</head>

<body>
  <div id="titleimage">
    <a href="#">
      <img src="images/vk8.png" /><span>PORTFOLIO</span>
    </a>
  </div>
</body>

读者

您可以添加vertical-align:middle#titleimage span

#titleimage{
    background: red;
    display: inline-block;
}
#titleimage a{
    text-decoration: none;
}
#titleimage img{
    width: 33px;
    height: 36px;
    vertical-align: middle;
}
#titleimage span{
    color: white;
    font-family: sans-serif;
    font-size: 26px;
    vertical-align:middle;
    }

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何垂直对齐div的文本和图像中间?

来自分类Dev

在图像顶部垂直对齐中间和居中的文本

来自分类Dev

如何垂直对齐文本和4个图像?

来自分类Dev

CSS-如何垂直对齐文本和图像?

来自分类Dev

垂直对齐 div 和图像

来自分类Dev

如何垂直对齐图像和文本

来自分类Dev

使DIV在中间垂直对齐

来自分类Dev

列表垂直对齐文本中间与列表样式图像

来自分类Dev

列表垂直对齐文本中间与列表样式图像

来自分类Dev

Bootstrap-在中间的div中垂直对齐图像

来自分类Dev

垂直对齐:中间错位正常文本和

来自分类Dev

如何在具有百分比高度的div中间垂直对齐文本?

来自分类Dev

如何在两个div的中间垂直对齐文本

来自分类Dev

如何在两个div的中间垂直对齐文本

来自分类Dev

如何在框大小div中垂直对齐中间文本?

来自分类Dev

如何将文本垂直对齐到列表的中间

来自分类Dev

JS图像滑块,中间垂直对齐

来自分类Dev

AnythingSlider:中间文本垂直对齐

来自分类Dev

CSS在中间垂直对齐文本/按钮

来自分类Dev

在Div内垂直对齐图像和文本

来自分类Dev

在div中垂直对齐图像和文本

来自分类Dev

根据浮动图像的高度垂直对齐div中的文本

来自分类Dev

div列内部中间垂直对齐

来自分类Dev

在弯曲的 div 中间垂直对齐内容

来自分类Dev

如何垂直对齐图像

来自分类Dev

如何垂直对齐图像?

来自分类Dev

如何使此图像和文本居中且div垂直对齐?

来自分类Dev

如何在div左上垂直对齐的图像上放置文本作为覆盖

来自分类Dev

如何在div中并排垂直对齐图像和文本