gpt4 book ai didi

html - 我的 HTML/CSS 中禁用了滚动条?同时使用 Progid Microsoft 渐变。

转载 作者:行者123 更新时间:2023-11-28 18:57:50 25 4
gpt4 key购买 nike

注意:请查看问题底部的更新!

这是我的 HTML/CSS 的摘录(样本):

html { height: 100%; }
body
{
height: 100%;
margin: 0px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6699CC', endColorstr='#1C3854');
}

.container
{
display: inline-block;
width: 50%;
}

.box
{
width: 80%;
margin-left: auto;
margin-right: auto;
}

<body>
<div class="container">
<div class="box">
<!-- content 1 -->
</div>
</div><div class="container">
<div class="box">
<!-- content 2 -->
</div>
</div>
</body>

此页面只需要在 IE8+ 中工作(因为它在 SOE 上运行)。

当浏览器最大化和/或内容非常少时,如预期的那样没有滚动条。

当浏览器很小和/或有很多内容时,会有滚动条,但它们是灰色的。用户无法滚动到可见区域边缘以外的内容。

我已经尝试在 HTML 和 body 上指定一个溢出属性,但它仍然只提供灰色的滚动条。

注释掉 height: 100% for html/body 似乎修复了垂直滚动而不是水平滚动——但是它破坏了我的渐变。

我做错了什么?

更新:我试图将一个样本与 lorem-ipsum 内容放在一起以显示 jQuerybeast 的问题,我发现滚动突然起作用了:我最初感到困惑但后来意识到我没有包括背景渐变(过滤器:progid……)。一旦我添加了渐变,滚动就停止了。为什么这个梯度中断滚动?

最佳答案

不幸的是,目前还没有很好的解决方案。

更糟糕的是:progid:DXImageTransform.Microsoft.gradient 漏洞百出 所以鼠标事件(悬停、点击、滚动等)漏洞百出。 - 小心!

无论如何,您最好开始考虑您认为可以接受哪些回退/变通方法/NastyHacks。

您可以考虑使用渐变背景图像并相应地重复。

关于html - 我的 HTML/CSS 中禁用了滚动条?同时使用 Progid Microsoft 渐变。,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7225414/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com