将 CSS 应用于 <html:link> 标签答案

【问题标题】：applying css to <html:link> tags将 CSS 应用于 <html:link> 标签
【发布时间】：2011-06-13 09:51:06
【问题描述】：

我开始使用 struts，但在标签上应用我的 css 时遇到了困难。

<html:link action="LoginLink" styleClass="loginButton"/>

基本上我想在一个链接上应用一个按钮图像，该链接会进入登录页面。

我已经成功地在表单的提交按钮中使用了这种方法，我认为同样的方法也适用于链接，但是它没有正确显示。

<html:submit styleClass="submitButton" value=" " ></html:submit>

补充一点，当我在链接上放置一些文本时，我可以看到按钮图像的顶部，例如：

<html:link action="LoginLink" styleClass="loginButton" >Some text here</html:link>

是否有任何我可以使用的替代标签，或者有什么方法可以设置链接标签的高度和宽度（以像素为单位），以便按钮可以正常显示？

这里也是 loginButton 的 css 供参考：

.loginButton {
    border:none;
    background:url('../images/adminbutton.png');
    height: 59px;
    width: 138px;
}.loginButton:hover {
    background:url('../images/adminbutton2.png');

}.loginButton:active {
    position:relative;
    top:1px;
}

【问题讨论】：

标签： css button struts struts-html

【解决方案1】：

尝试添加此属性

display: block;

到 .loginButton

【讨论】：

这在一定程度上起作用了，在图片能够显示的同时，链接的可点击区域比图片大，所以我可以点击的地方有一个空白区域。我希望这是朝着正确方向迈出的一步，因为我只需要将可点击区域减小到与我的图像大小相同。如果对这种方法有任何跟进，我们将不胜感激。
将边距和内边距属性设置为 0，或者您应该编辑此图像并切断按钮周围的空白（如果有空白）。
按钮没有多余的空白，也尝试设置margin和padding，但无济于事。 :(
图片大小和 CSS 样式中的 height&width 属性完全一样？
好的，我找到了罪魁祸首，似乎 css 的图像高度和宽度不正确，导致错误渲染，问题已解决，谢谢！！