草庐IT

Overflow

全部标签

html - overflow hidden 的响应式垂直居中

在搜索StackOverflow和Google之后,我仍然想知道如何将比其父元素大的图像垂直居中。我不使用高度,只使用最大高度,因为我想制作一个没有jQuery的响应式解决方案。如果可能的话。这是一些代码: 最佳答案 要使更大的图像垂直居中,您可以使用下面的构造和css和CSS:.img-wrapper{position:relative;overflow:hidden;height:425px;}.img-wrapperimg{position:absolute;top:-100%;left:0;right:0;bottom:-1

javascript - 如何使用 jQuery 设置 overflow-x?或者 : How to set css-properties with a '-' (dash)?

我想用jQuery设置overflow-xcss属性,但它不起作用:$('.mySelector').css({color:'Red',overflow:'auto',overflow-x:'scroll'});如何设置其中包含“-”(破折号)的属性? 最佳答案 您可以使用驼峰式大小写:$('.mySelector').css({color:'Red',overflow:'auto',overflowX:'scroll'});或引号键:$('.mySelector').css({color:'Red',overflow:'auto'

html - 为什么 "overflow-y:hidden"会影响在 x 轴上溢出的元素的可见性?

考虑这个例子:http://jsfiddle.net/treeface/P8JbW/HTML:CSS:#test{position:relative;margin-left:50px;margin-top:50px;border:1pxsolidblack;height:50px;width:50px;overflow-x:visible;overflow-y:hidden;}img{position:absolute;left:-11px;}我期待看到这个:但是我得到了这个:这里好像override了overflow-x属性。这是实际发生的事情吗?假设我必须将overflow-y设置

html - 为什么 overflow hidden 会阻止 float 元素逃离容器?

我在处理网页时遇到的一个常见问题是floatdiv标签爬出它们的容器,如代码片段所示。#wrapper{border:1pxsolidred;}#wrapperdiv{float:left;font-size:3em;}HelloWorld有很多肮脏的方法来解决这个问题(即插入一个div和clear:both)但是,我看到的一个更简洁的解决方案是将包装器div的overflow设置为hidden:#wrapper{border:1pxsolidred;overflow:hidden;}#wrapperdiv{float:left;font-size:3em;}HelloWorld这在浏

html - overflow hidden 的div中的中心图像

我有一个400像素的图像和一个较小的div(宽度并不像我的示例中那样总是300像素)。我想让div中的图片居中,如果溢出就隐藏。注意:我必须保留图像上的position:absolute。我正在使用css-transitions,如果我使用position:relative,我的图像会有点抖动(https://web.archive.org/web/20120528225923/http://ta6.maxplus.be:8888/)。jsfiddlehttp://jsfiddle.net/wjw83/1/ 最佳答案 您应该使容器相

html - 哪些浏览器支持 `overflow-y` ?

据我了解,overflow-y是一个CSS3选择器。但是在http://www.findmebyip.com/litmus,它没有显示该选择器,表明我不知道哪些浏览器支持它。首先,overflow-y和overflow-x实际上是CSS3选择器吗?其次,哪些浏览器支持它们? 最佳答案 不,overflow-x和y不是CSS3选择器。它们只是简单的属性,类似于overflow但有方向限制。来自http://reference.sitepoint.com/css/overflowTheCSS3overflow-xandoverflow-

css - 如何使用具有固定位置 div/的 float、clear 和 overflow 元素并排对齐两个 div

所以我一直在尝试将两个div并排对齐而不重叠。我有一个div将固定为侧边栏,右侧的div作为内容。希望有人能帮助我。body{background-color:#444;margin-top:0;margin-bottom:0;}#wrapper{width:1005px;margin:0auto;padding:0;overflow:auto;}#leftcolumn{width:250px;background-color:#111;padding:0;margin:0;display:block;border:1pxsolidwhite;position:fixed;}#righ

html - 将未知大小的大图像置于 overflow hidden 的较小 div 中

我想将一个img放在div中,没有javascript和没有背景图片。下面是一些示例代码我不知道img的大小,应该可以超过parent的宽度我不知道父div的宽度(它是100%)父div有固定高度图像比父级大,父级有溢出:隐藏只需要支持现代浏览器期望的结果。(忽略不透明度等,只需注意定位)。我知道这可以通过背景图片轻松完成,但我不适合。我也可以使用javascript,但这似乎是实现此目标的一种非常繁琐的方法。谢谢!jack 最佳答案 这个怎么样:.img{position:absolute;left:50%;top:50%;-we

html - HTML "overflow : auto"和 "overflow : scroll"之间的区别

当我研究overflow属性的值时,我遇到了这两个值:auto和scroll,后者添加了滚动条如果内容溢出元素。谁能解释一下它们之间的区别是什么? 最佳答案 Auto只会在裁剪任何内容时显示滚动条。Scroll将始终显示滚动条,即使所有内容都适合并且您无法滚动它也是如此。 关于html-HTML"overflow:auto"和"overflow:scroll"之间的区别,我们在StackOverflow上找到一个类似的问题: https://stackover

html - -webkit-overflow-scrolling 是否适合生产使用?

我一直在使用-webkit-overflow-scrolling在iOS上平滑滚动叠加导航菜单,但是,我一直在与一个错误作斗争(我似乎无法找到回答任何地方)。查看MDN站点上的属性:Thisfeatureisnon-standardandisnotonastandardstrack.DonotuseitonproductionsitesfacingtheWeb:itwillnotworkforeveryuser....https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling如果它“不在标准轨道