如何在span標簽中水平和垂直居中圖像？

Question

我在span標簽中使用了img標簽。 我已將span標記的顯示設置為內聯塊並賦予其背景顏色。 如何將圖像置於span標簽內？

<span class='plus' id='plus_block_1'> <img src='images/plus.png' /> </span>

CSS：

.plus {
  display: inline-block;
  background-color: #e1e1e1;
  height: 40px;
}

Answer 1

您可以通過為.plus提供與.plus高度匹配的行高來實現此.plus 。 然后將img設置為vertical-align: middle 。

查看示例（高度的兩倍以使其清晰）： http ： //jsfiddle.net/1om0emoe/