Html 引导css:正文不包含页面上的所有元素
我已经将引导式Sass添加到Rails项目中,并且正在尝试重新设计其主页。我面临的问题是,我添加到Html 引导css:正文不包含页面上的所有元素,html,css,twitter-bootstrap,sass,Html,Css,Twitter Bootstrap,Sass,我已经将引导式Sass添加到Rails项目中,并且正在尝试重新设计其主页。我面临的问题是,我添加到元素中的背景样式仅对加载页面时最初可见的页面部分有效。该页面实际上向下滚动以显示附加元素,这些元素都包含在中。为了解决这个问题,我用一个..将所有内容都包含在中。在CSS中,我做了两件事:我首先尝试使用overflow:auto属性,但没有达到预期效果。我还尝试了以下方法: .clearit { zoom: 1.0; clear: both; } .clearit:after {
元素中的背景样式仅对加载页面时最初可见的页面部分有效。该页面实际上向下滚动以显示附加元素,这些元素都包含在
中。为了解决这个问题,我用一个..
将所有内容都包含在
中。在CSS中,我做了两件事:我首先尝试使用overflow:auto
属性,但没有达到预期效果。我还尝试了以下方法:
.clearit {
zoom: 1.0;
clear: both;
}
.clearit:after
{
zoom: 1.0;
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
overflow: auto;
}
即使如此,浏览器似乎认为我的
只是加载时最初可见的页面部分的100%,而不是直到滚动条底部的整个页面。我已经搜寻了在线解决方案和指南,并尝试了多种方法好几天,但还没有找到一种有效的方法。如有任何见解,将不胜感激 这可能没有什么帮助,但您是否正在尝试完成我在这里所做的事情
我没有将顶部设置为100%,而是将顶部设置为高度=100%,并设置背景图像。有关示例,请参见此处的.intro部分类:
虽然我没有在这个页面上滚动,但在这里可以找到一个更容易阅读的示例。它使用完全相同的技术,只是减去标题栏和.intro部分下面的部分:
如果我对你的要求不满意,我道歉。我也是新来的,所以如果这不是一个正确格式的响应,我很抱歉。我只是想提供一些快速的帮助
.intro-section {
background: url(images/my-background-image.jpg) no-repeat bottom center scroll;
height: 100%;
padding-top: 50px; /* So content isn't covered up by the header bar */
}