1

我正在使用 5 个带有悬停效果的横幅图像并使用以下代码

#banner
{
    float:left;
    width:99.025%;
    padding:0 0 0 10px;
    margin:0;
    height: 16.714em; /* 234px*/
    position:relative;
    overflow:hidden;
    display:block;
    background:url('/pages/images/bottom_wood_repeater.jpg') 0 104px repeat-x;
}

#banner img
{
    float:left;
    width:19.435%; /*197px;*/
}

#banner a img
{
    float:left;
    display:block;
}

#banner a:hover img
{
    float:left;
    position:relative;
    top:-16.714em; /* 234px*/
}

我可以使用百分比而不是 em 的高度吗？

height: 16.714em; /* 234px*/

实际上我正在创建响应式设计，它正在为较小的分辨率或移动设备制造问题。

当前站点： http: //new.brandonplanning.com/home

提前致谢 ：）

4

5 回答 5

5

是和不是。

具体来说，如果父元素没有固定高度，则不能这样做。想一想：如果一个元素的高度等于其父级高度的百分比，则需要首先计算父级的高度。但是要计算父母的身高，首先需要计算其孩子的身高。但是在计算这个孩子的身高之前，你需要计算父母的身高。你看这是怎么回事。

如果父母确实有一个固定的高度，那么孩子的百分比高度就可以了。

如果父级没有固定高度并且您为子级设置百分比高度，浏览器将简单地放弃并将子级视为具有height: auto.

于 2012-05-11T08:35:24.320 回答
1

我可以使用百分比而不是 em 的高度吗？

是的你可以。如果考虑到其他属性，height:25%;但可能不会达到您想要的效果。

身高可以

auto - 浏览器计算高度。这是默认的

length - 以 px、cm 等为单位定义高度。

% - 以百分比形式定义包含块的高度

如果您仍然遇到布局问题，您可以检测客户端是否在移动设备上，并使用不同的 CSS 显示它们。

于 2012-05-11T08:36:52.813 回答
1

确保您将“%”符号添加到您的 css 中，您始终可以使用 %。

于 2012-06-09T17:05:35.577 回答
0

我不明白为什么不。从技术上讲是可以的。你试过用%吗？

于 2012-05-11T08:37:23.270 回答
0

简单地说，是的，我们在 CSS 中使用高度百分比。

于 2012-06-09T17:03:59.243 回答