请参阅本页中的示例 2
本例中使用的左右圆角图像最高为 83px 高度。我尝试使用高度为 25px 的左右圆角图像(选项卡菜单高度为 25px),但菜单会混乱。
我的问题是
- 为什么图像必须比实际标签高度大得多?
- 如何确定图像大小?
如果您使用图像作为该元素的背景,那么您需要这个
.some_class
{
height:100px; width:100px;
background: url('close.png');
background-repeat:no-repeat;
background-size: 100% 100%;
-webkit-background-size: 100% 100%; /* Safari */
-khtml-background-size: 100% 100%; /* Konqueror */
-moz-background-size: 100% 100%; /* Firefox */
}
这将使图像保持元素的高度和宽度
如果您在 HTML 代码中使用元素内的图像,例如
<div class="example"><img tag="images/someimage.jpg"></div>
然后在CSS中你需要:
.example
{
height: 100px
width: 100px
}
.example img
{
width:100%
height:100%
here you can set up rounded borders for it too
}