我发现了一个完美的简单解决方案,适用于Chrome,IE和Firefox上的win7。
我在链接()中放置了一个具有相同width和height作为(这是图像尺寸)的单元格。
也做了表:text-align:center。 text-align:center确保表格内的文本将水平居中。并且表格的优点是即使在悬停鼠标时字体大小发生变化,文本也会垂直居中。此外,当字体大小增加时,该表阻止了链接图像和其他链接的移动。
我删除了所有padding。因为如果我将(height,width)与(padding)组合在一起,它将在不同的浏览器上产生不同的结果(尤其是IE和Chrome)。
将内容放入可能是错误的想法,但它确实适用于大多数浏览器。
我还把这行代码作为我的html文件的第一行:
这使得
继承了所有东西,我不知道为什么,但它确实简化了东西。结果代码是:
Home pagebody {
font-family:Palatino, ‘Book Antiqua’, Georgia, Garamond, ‘Times New Roman’, Times, serif;
font-size: 13px;
color: #000060;
background-color: #005070;
background-repeat:repeat-x;
text-align:center;
}
.menu
{
height:64px;
width:100%;
background-image:url(img/bglb2.png);
background-repeat:repeat-x;
text-align:center;
}
.menuLink, .menuLink:visited
{
color:#FFFFFF;
background-image:url(img/btk.png);
text-decoration:none;
font-size: 20px;
width:152px;
height: 52px;
display:inline-block;
margin-left: 10px;
margin-right: 10px;
margin-top: 6px;
}
.menuLink:hover
{
color:#CC7011;
background-image:url(img/bto.png);
font-size: 26px;
}
table.ml
{
text-align: center;
width:152px;
height: 52px;
}
谢谢你们。