- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
一言以蔽之
我需要一个 CSS 解决方案来满足以下要求:
更多细节
今天对我当前的网站元素提出了一个新要求:一个在左侧和右侧具有渐变的背景图像(替换当前的正文背景图像)。现在的挑战是指定两个不同的背景图像,同时保持布局规范的其余部分。不幸的是,(简单的)布局与这两个背景不相符。
我的布局基本上是一个固定宽度的居中列:
#main_container {
background-color: white;
margin: 0 auto;
min-height: 100%;
width: 800px;
}
此外,有必要将列的最小高度拉伸(stretch)到 100%,因为有相当多的页面只有很少的内容。以下 CSS 样式可以解决这个问题:
html {
height: 100%;
}
body {
background-image: url('old-background.png');
margin: 0;
height: 100%;
padding: 0;
}
到目前为止一切顺利 - 直到带有渐变的新 body 背景图像出现。我尝试了以下解决方案
使用其中任何一个,动态高度解决方案都被破坏了。要么主容器太小时没有拉伸(stretch)到 100%,要么内容实际上更长时背景保持在 100%
最佳答案
修改:
<body>
<div class="container"><div>
<div id="main_content"></div>
</body>
使用 CSS:
html {
height: 100%;
}
body {
background: url(left.png) repeat-y top left;
background-attachment:fixed;
height: 100%;
margin: 0;
padding: 0;
}
div.container {
background: url(right.png) repeat-y top right;
height: 100%;
width: 100%;
position:fixed; /* This won't work in all browsers. May need a JS solution for IE6 */
}
#main_content {
height: 100%;
width: 800px;
margin: 0 auto;
background-color: white;
}
编辑:
此版本适用于支持 position:fixed
(非 ie6)的浏览器。
关于html - CSS challenge : Two background images, centered column with fixed with, min-height 100%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2578633/
我在 jquery selectors 中进行了搜索一段时间了,但找不到任何解决我的问题的方法。 我有一个由 foreach 归档的 html 表。每行都有几个弹出工具提示的链接。我的问题:找不到正确
我决定采取Eudyptula Challenge . 在我提交了第一个任务之后,它就是构建一个简单的“Hello World!”。模块,我收到了以下答案。 Please read the requir
因此,在安全性非常重要的应用程序的情况下 - 如何实现挑战问题的想法。那就是……你会: 检测电脑IP是否变化,提出挑战题。 检测 cookie 是否丢失。 检测计算机名称是否不同。 上述方法的一些组合
我有一个网络应用程序可以接受匿名和经过身份验证的请求。如果我将表单数据(通过文件上传)匿名发布到 Web 应用程序,然后收到 401 质询,我会在第二次请求时再次重新发送所有表单数据吗? 我并不是要避
我正在尝试解决CTF挑战,其中的目标是猜测生成的数字。由于这个数字很大,而且每个数字只有10次尝试,我认为你不能应用二进制搜索或任何类型的算法来解决它,这与以某种方式获得随机函数的种子并能够生成下一个
我正在尝试解决CTF挑战,其中的目标是猜测生成的数字。由于这个数字很大,而且每个数字只有10次尝试,我认为你不能应用二进制搜索或任何类型的算法来解决它,这与以某种方式获得随机函数的种子并能够生成下一个
我遇到了与这篇文章中所述相同的问题:“First external login attempt redirects back to login action, second one works” 对他
我在使用 python3 的 CodeFights 上遇到了“areSimilar”问题。 提示指出“如果可以通过交换一个数组中的最多一对元素从另一个数组中获得一个数组,则两个数组被称为相似。 给定两
我正在寻找一种方法将 OpenFeint 的仪表板 View 直接打开到挑战 View 。有一条消息会启动仪表板,还有一条消息会在发送之前显示挑战: [OpenFeint launchDashboar
该命令: $ letsencrypt certonly --manual --preferred-challenges dns --email foo@bar.com --domains test00
Link to Codewars challenge 这是非常基本的,但由于某种原因,我无法弄清楚为什么我无法返回 null当有不是 数组中任何不连续的数字。当数组不完全连续时,我的代码可以正常工作:
ControllerBase类(class)有Challenge方法,返回 ChallengeResult 的对象类(class)。CookieAuthenticationOptions类(class
我一直在努力解决 Hackerrank 上的热身挑战。对于这个特殊的挑战 - https://www.hackerrank.com/challenges/cut-the-sticks - 我已经编写了
我在 Android 应用程序中使用 Volley 从 Misfit API ( http://build.misfit.com ) 获取数据。我尝试构建一个间歇性 Activity ,在有人登录后从
我的代码有效,但未被接受以通过挑战。对于我做错的任何帮助,我们将不胜感激。 挑战说明: 给定一个整数数组。返回一个数组,其中第一个元素是正数的计数,第二个元素是负数的总和。如果输入数组为空或 null
背景 我有一个第三方框架,它对我提供给它的 URL 进行一些网络请求。请求的格式为: https://10.0.2.2:8000/api/ .... 由于架构是 https,我不断收到来自第三方库的错
我已经完全按照许多教程将 GameCenter 集成到我的应用程序中。我正在使用正确的代码来发布分数,并获得分数正在报告给 GC 的报告。但是,当我尝试加载排行榜时,它显示的是“无挑战”空白屏幕。 我
有人可以告诉我为什么 FCC 不接受我的解决方案,即使它通过了所有测试? 下面是挑战的链接,但我将在此处发布问题和测试,以更好地遵守社区。 FCC 挑战: https://www.freecodeca
我正在关注this java 中的小例子,用于测试 JRadius 客户端。但我不断收到此错误: Exception in thread "main" net.sf.jradius.exception
我在我的项目中使用 google reCAPTCHA 版本 2。它工作正常。但是当我选中复选框时,它总是显示一组图像作为挑战。但我只想显示字母而不是图像。我该怎么做? 最佳答案 据我所知,目前还没有这
我是一名优秀的程序员,十分优秀!