Css 如何在div中垂直对齐图像？

如何在div容器中将图像显示为垂直对齐

图片“setting.png”放在我所附代码的最后一列。请建议解决方案

.table{
width: 100%;
margin: 20px 0px 20px 0px;
background-color: #EEEEEE;
}

.tableRow{
width: 100%;
clear: both;
height: 40px;
line-height: 40px;
border-bottom: 1px solid #cccccc;
}

.tableCol{
float: left;
height: 40px;
line-height: 40px;
}

<div class="table">
    <div class="tableRow">
        <div class="tableCol" style="width:10%; text-align:center;">1</div>
        <div class="tableCol" style="width:40%">Michael</div>
        <div class="tableCol" style="width:40%">webexp@gmail.com</div>
        <div class="tableCol" style="width:10%;">
        <a href="" ><img src="images/icons/setting.png" alt="Setting" align="absmiddle"  /></a>
        </div>
    </div>  
</div>  

.table{
宽度：100%；
保证金：20px 0px 20px 0px；
背景色：#EEEEEE；
}
tableRow先生{
宽度：100%；
明确：两者皆有；
高度：40px；
线高：40px；
边框底部：1px实心#CCCC；
}
tableCol先生{
浮动：左；
高度：40px；
线高：40px；
}
1.
迈克尔
webexp@gmail.com

只需添加

（链接前的空格）

Css有一个标记名 “垂直对齐”可能是您将在此处获得解决方案，这应该可以： 将其添加到包含应居中的图像的div中

display:table-cell;
vertical-align:middle;

---

这应该使图像垂直居中，无论您的div的大小或它包含的图像。

您可以使用位置：绝对如果您知道settings.png图像的尺寸（本例为20px x 20px）

将classtableColSettings添加到

希望这有帮助
 更好的解决方案是添加到css:img{margin top:10px；}好的，谢谢，但这不是正确的方法，因为在某些情况下，表格高度会增加，那么我们也会增加margin top，对吗？还有其他解决方案吗？
vertical align
是CSS属性，而不是“标记名”。我已经在CSS中提到过。。你可以谷歌搜索css标签，然后你会发现css标签是css属性。所以，不要试图变得过于聪明@PavloMykhalovI并没有不尊重的意思，只是想帮忙。这是一个定义问题，正确的定义无疑是一种“财产”。如果你仍然不确定，我建议你去探索，。我已经看到了它-这是荒谬的错误，这就是为什么你找不到另一个以同样方式定义它的来源。考虑您所引用的源的声誉：MDN和Web教育社区Wiki是由现代Web开发的领导者和公司创建的。
img {
margin-top:10px;
}

display:table-cell;
vertical-align:middle;

.tableColSettings{
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin: -10px 0 0 -10px; /* Half image dimensions */
    width: 20px;
    height: 20px;
    line-height: 0;
}
.tableColSettings img{
    width: 100%;
}