停止产生水平滚动条的宽图像 [英] Stop wide image from producing horizontal scrollbar
问题描述
在网页上,我的图像很宽,应该占据屏幕正确的50%.它看起来像我想要的,但是会产生不必要的水平滚动条.我不希望图像按比例缩小,我希望图像保持原样,但不产生水平滚动条.我该怎么办?
On a webpage I have a wide image, which should take up the right 50% of the screen. It appears as I want it to, but it produces an unwanted horizontal scroll bar. I don't want the image to scale down, I want it to remain looking exactly as it does, but to not produce a horizontal scroll bar. How could I do this?
HTML:
<div class="image">
</div>
CSS:
.image {
position:absolute;
left:50%;
background-image: url('Images/banneriPhone.png');
width:774px;
height:759px;
}
我有一些建议,我删除了溢出选项.这没有用,所以我更改了代码(将图像放入html中),但是仍然没有用.这是CSSDesk链接:
I had some suggestions that i remove the overflow option. This didn't work, so i changed the code around (put the image in the html) but this still didn't work. Here's the CSSDesk link:
推荐答案
在CSS中使用此选项可隐藏CSS类图像的滚动条:
Use this in your CSS to hide the scrollbar of the CSS class image:
.image {
position:absolute;
left:50%;
background-image: url('Images/banneriPhone.png');
width:774px;
height:759px;
overflow-x:hidden;
overflow-y:hidden;
}
overflow-x
将隐藏水平滚动条
overflow-y
将隐藏垂直滚动条
在这里您可以看到溢出属性的一些示例: http://www.brunildo.org/test/Overflowxy2.html
Here you can see some example of the overflow property: http://www.brunildo.org/test/Overflowxy2.html
这篇关于停止产生水平滚动条的宽图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!