为什么我的图像没有在中心对齐？

Question

我无法弄清楚为什么标签之间的图像没有与中心对齐，即使我已经将css声明为内联，但优先级不起作用。

我已在<style>标记中声明了text-align，但我只希望此特定标记与中心对齐，而不是其他标记。

这是我的HTML，

<td class="ospy_td" style="background-color:#ddd;border-bottom-left-radius:5px;style=text-align:center">
    <label class="ospy_lab" style="text-align:center">
        <img id="bt" src="img/bt.png" width="30" height="29" />
    </label>
</td>

这是我的CSS，它在同一个html页面的标签中定义，

.ospy_td, label {
    text-align: left;
    vertical-align: middle;
    cursor: default;
    font-weight:normal;
    color:#0066c0;
};

Answer 1

我在CSS和html元素的使用中看到了一些错误。

但其中一个产生问题的是style=内部样式属性：

＆lt; td class =“ospy_td”style =“background-color：#ddd; border-bottom-left-radius：5px; 的风格= 文本对齐：中心” ＆GT;

删除这个“style =”，事情就行了。

---

我的建议代码更改（jsFiddle）：

HTML

<table>
    <tr>
        <td class="ospy_td">
            <i class="ospy_lab" />
        </td>
    <tr>
</table>

CSS

table {
    width: 100%;
}
td {
    background: #66f;
    text-align: center;
}
.ospy_td {
    background-color: #ddd;
    border-bottom-left-radius: 5px;
    cursor: default;
    vertical-align: middle;
}
i.ospy_lab {
    background-image: (img/bt.png);
    background-position: center center;
    background-repeat: no-repeat;
    font-weight: normal;
    color: #0066c0;
    display: inline-block;
    height: 29px;
    width: 30px;
}

Answer 2

.ospy_td, label {
    text-align: left; // this is your problem, change to center
}

你在这里忘记了一个分号

 style="text-align:center"

更改为

style="text-align:center;"