<分区>
我有一个 <div>
具有固定高度和 overflow:auto
的元素.
我只想在内容大到足以滚动时应用样式。示例:当它可滚动时,我想在框的底部应用一个嵌入框阴影,但是当内容不够大时,我不希望框阴影可见。
...最好不要使用脚本并尽可能跨浏览器。
更新
fiddle根据要求
谢谢
<分区>
我有一个 <div>
具有固定高度和 overflow:auto
的元素.
我只想在内容大到足以滚动时应用样式。示例:当它可滚动时,我想在框的底部应用一个嵌入框阴影,但是当内容不够大时,我不希望框阴影可见。
...最好不要使用脚本并尽可能跨浏览器。
更新
fiddle根据要求
谢谢
最佳答案
(抱歉)
但是,我知道您指定不想使用脚本,但它相对简单,例如使用 jQuery:
HTML
<div id="div1">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</div>
<div id="div2"></div>
jQuery
$.fn.toggleScrollClass = function () {
this.each(function () {
$(this).toggleClass('hasScroll', this.scrollHeight > this.clientHeight);
});
}
$('div').toggleScrollClass();
CSS
div {
border: 1px solid black;
width: 100px;
height:100px;
overflow:auto;
}
.hasScroll {
border: 1px solid red;
}
关于html - 仅应用于可滚动元素的 CSS 样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23629497/