2回答
我只是在制作一个带有fixed背景定位的元素的网页，在我将css动画应用到一个(完全不同和不相关的)元素之前，它工作得很好。
我试着删除/重新应用动画，以确保它确实是问题所在，而且，当我添加动画时，背景定位(页面上的每个元素)都是静态的，并且在删除动画时再次工作。
这是正常的吗？
最终，我在寻找一种解决方案，允许：
相对定位，
浮动元素(或类似包装器的最小子元素)
用于固定的背景位置
在使用CSS3动画的网页中，
与Chrome兼容。
下面是动画：
这里没有他们：
我只在Chrome上测试过这个。
UPDATE：如一个答案所示，给出具有固定背景位置的元素
浏览 8提问于2014-04-05得票数 4
回答已采纳
我有一个固定宽度和高度的分区如下：
<div class="fontTest">A</div>
我制作了一个大小为800 to *169 to的jpeg背景图像，以适应这个div。下面是我使用的css：
.fontTest {
font-family:'Noto Serif', serif; color:#744801;
margin-left:auto;
width:800px;
height:169px;
margin-right:auto;
background: #FDEE
浏览 0提问于2015-05-28得票数 0
回答已采纳
2回答
这是我的css：
body {
background-image: url('mybackground.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100%;
}
但是当我向下滚动时，背景图像是透明的&这不是我想要的。(我的背景图像就像一个标题图像，就像这个网站，但是如果固定的话，标题)。
我该怎么办？
有什么建议吗？
浏览 3提问于2015-07-16得票数 1
回答已采纳
1回答
我有一个大背景封面。
<div id="cover">
...
</div>
和CSS
#cover {
background:url('cover.jpg') no-repeat fixed center center / cover;
height: 350px;
width: 100%;
}
预期输出：背景图像大小调整为350 px100%(在我的示例中为350x900)，应该具有基于<div id="cover"></div>的滚动效果。
实际输出：将背景图像
浏览 2提问于2014-08-27得票数 1
1回答
为我目前正在工作的一个网站。我试图在页面上给背景图像一种视差效果。基本上，我有一个div，它有一个设置的高度，当用户点击每个旋转项目时，我会更新div的背景图像。背景图像固定在顶部中心，当页面第一次加载时，它工作得非常好。但是如果你稍微向下滚动，使得div的一部分不可见，并在旋转器中切换项目，背景图像只会在div的某个点加载，但当我滚动或触摸检查器中的任何元素时，它就会完全加载。
这是我的标记，以防我做错了什么，但它在Firefox和IE7/8/9上工作得很好，但就是不能在Chrome上工作。任何帮助都将不胜感激。
.home .rotator
{
height:450px;
浏览 0提问于2012-10-30得票数 0
回答已采纳
我想有一个固定的背景图像(大约46k)的网站，工作在我的个人电脑浏览器。
然而，当在我的移动浏览器上滚动时，它花了大约一秒的时间重新绘制背景图像。
有什么办法解决这个问题吗？谢谢
这是我的css：
html, body {
background: url('/assets/img/bg.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
ba
浏览 0提问于2013-09-08得票数 2
回答已采纳
2回答
我正在创建一个应用程序，我希望它有一个固定的背景图像在它。我使用的是html5、css3和javascript。我让我的css像往常一样修复我的背景图像，就像这样：
body{ background:#1F1F1F url(../assets/bg.png) fixed;}
好的，即使在IE8和背景图像固定的情况下，浏览器中的所有东西都工作得很好。但是当涉及到我的移动设备的默认浏览器时，图像不再是固定的！
任何帮助都将不胜感激。
浏览 1提问于2012-09-25得票数 3
回答已采纳
我想编辑一个Wordpress网站使用主题的CSS，我想使标题图像滚动时固定，但问题是，标题不是背景图像，而是一张图片。
我知道如果我可以对背景图像这样做：
.homeBG {
background-image: url('someImage.jpg');
background-attribute: fixed;
}
但如果是这种情况，您会使用什么命令：
.homeBG {
content: url('someImage.jpg');
/*make the image stay when scrolled*/
}
注意:将“内容”
浏览 1提问于2015-06-19得票数 0
4回答
是否可以指定您希望背景图像(不重复)坐着，例如，5 5px远离右侧边缘？
我知道使用CSS可以做到这一点，但它默认为左侧边缘。我希望背景图像总是坐在远离右边边缘的5 5px。
CSS
#companyLinks li {
display: inline;
padding-right: 10px;
background-image: url(/img/shd/spacer.png);
background-repeat: no-repeat;
background-position: right center;
浏览 5提问于2012-09-14得票数 0
回答已采纳
我的委托人想为她的新网站提供全屏背景。设置并不那么复杂，因为我选择了CSS3方法，并对较旧的IE版本进行了后备。下面是CSS：
html {
/* Fullscreen backgroung image per CSS3 with 'background-size: cover' */
background: url(../images/background.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cove
浏览 0提问于2012-12-18得票数 4
回答已采纳
1回答
我在做一个浏览器游戏。
背景足够大，只需在用户滚动时微妙地向下滚动即可。这是一个相当长的卷轴，所以有一个固定的背景有点无聊，如果背景不是固定的，它很快就会变成空白，因为它不够大，不足以覆盖整个游戏内容。
我想做背景卷轴，在用户滚动的相反方向，但是非常微妙地为了一个好的效果
我刚才解释的这种效果是如何产生的呢？我知道jquery可能可以做到这一点，但我避免使用jquery。我对香草javascript相当在行，我只是需要一点帮助，从哪里开始。我应该让背景和游戏内容2分开，当用户滚动游戏内容时，背景也会滚动一点吗？这能用CSS来完成吗？
谢谢!
浏览 0提问于2018-08-11得票数 0
回答已采纳
3回答
我正在建立一个网站，使用固定的背景图像之间的过渡部分。目前，它是纯CSS。这个效果适用于我测试过的所有浏览器，除了Mac上的Chrome ( 33.0.1750.146或34.0.1847.45测试版)。在PC上的Chrome上似乎工作得很好。
发生的是非常漂亮的strange...on滚动，图像被重复和叠加，整体上非常扭曲。再滚动一下，它就消失了。它不会在向上滚动时重新出现。
有什么想法或解决方案吗？！
当前页面：
当前屏幕截图(损坏，铬)：
当前屏幕截图(工作中，safari)：
看似相关的CSS：
.chris, .eric, {
background-position: cent
浏览 1提问于2014-03-10得票数 1
1回答
我有背景出现，一旦用户点击编辑按钮，或当加载页面在开始和消失后，一旦模式是显示或页面加载。背景效果很好，可以高亮显示整个页面。但是，当我用数据更新我的表，并且表的高度扩展时，背景只显示在屏幕的上半部分。请注意，我正在使用Ajax更新我的表，而不需要刷新页面。加载页面背景效果良好并覆盖整个页面时：
在使用ajax更新表格并单击一条编辑记录以再次显示背景之后，我得到了以下内容：
当表格更新时，如何使背景覆盖整个页面代码，如下所示：
<div class="backdrop">
</div>
CSS：
.backdrop {
浏览 14提问于2021-02-22得票数 0
回答已采纳
我已经在CSS中摆弄了几个小时的背景图片，并尝试搜索文章以找到解决方案，但仍然一无所获。我试图使我的背景图像适合屏幕，无论浏览器大小。
一开始，我使用的是这个CSS代码，它似乎在工作：
body {
background-image: url(images/background.jpg);
background-repeat: no-repeat;
background-size: cover;
}
但是当我重新调整浏览器的大小时，发生了这样的事情：
然后，我找到了另一个解决方案，它说我应该将背景图像放在html标记中，我尝试过这样做：
html {
backg
浏览 1提问于2018-04-05得票数 0
回答已采纳
3回答
我有个小问题。我试着做一些类似视差背景的事情。在我的第一次尝试中，我得到了一些有用的东西，但它可以更好地工作。当我滚动时，背景位置会发生变化。问题是它在滚动后几毫秒内会发生变化，这样我就可以看到滚动后背景是如何“跳跃”的。
代码：
var $w = $(window);
function move($c) {
var scroll = $w.scrollTop();
var diff = $c.offset().top - scroll;
var pos = '50% ' + (-diff)*0.5 + 'px';
$c.css(
浏览 1提问于2011-10-09得票数 6
回答已采纳
我创建了适合屏幕的背景图像class="Background"。
但是当我将样式化的css添加到标题class="Greetings"以创建网站上的文本时，背景布局就会中断。
怎样才能阻止这种情况的发生？
HTML：
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="Background"></div>
<div class="G
浏览 5提问于2022-09-15得票数 0
2回答
我在react和css中都是新手，我想知道如何为我的应用程序创建一个背景三角形，它带有全宽错误，不会随着页面大小的改变而改变角度。
这是我的实际页面：
这是它附带的css：
diagonaleBottom: {
position: "absolute",
bottom: 0,
width: "100%",
height: "35%",
clipPath: "polygon(100% 100%, 0 100%, 100% 0)",
background: "#0823
浏览 16提问于2020-05-05得票数 0
回答已采纳
我刚开始学习CSS/HTML，我正在复制BBC的网站。我有3种不同的背景白色/2红色，它们不是它们应有的长度。
下面是代码：
新闻栏，#主题菜单，#topmenudiv
我试过了所有类似问题中推荐的内容，但我仍然无法获得整个页面的背景。
浏览 2提问于2015-08-17得票数 0
回答已采纳
我正在开发asp.net webforms，其背景由3幅图片组成:顶部、左侧和右侧。这三个部分是从一个完整的图像裁剪，以容纳内容体的770 of宽度在中间。目前，这3张图片随着身体内容的移动，我向下滚动或向上滚动。当我滚动页面时，我希望背景保持不变。我在简单的html中使用这段代码，它适用于单个完整的背景图像：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Layo
浏览 1提问于2015-06-23得票数 2
回答已采纳
4回答
所以我有一个带有CSS梯度背景的身体。然后我有一个绝对定位的div，嵌套在里面，有一个背景覆盖。然后，内容包装器div被嵌套在这里面。我希望背景div是固定的，网页滚动在顶部。问题是，当页面滚动的时候，背景覆盖div就像滚筒一样消失了……
这是我的小提琴来证明这个问题..。 (尝试滚动结果窗格以查看我指的效果)。
HTML..。
<body>
<div id="bgwrapper">
<div id="wrapper">
Content...
</div&g
浏览 1提问于2013-05-20得票数 3
回答已采纳
我的background-attachment:fixed很好用。但是当我定义CSS3时，在DIV上旋转并向下滚动，background-attachment:fixed就停止工作了。
检查这个
现在，我正在研究chrome18。
当您删除旋转css，那么背景-附件:固定工作良好。
浏览 3提问于2012-03-29得票数 23
我有一个问题，一个大的固定背景图像在IE10触摸设备。(我有一个带有Windows 8的三星平板电脑，但我猜想在Surface上可以看到同样的行为，但无法证实。)
要将一个大的固定图像作为站点的背景，有两种方法：
1)在body元素上使用CSS3背景属性--这在IE10触摸设备上工作得很好。但是，在iOS浏览器中，背景与视图一起滚动。接下来是第二步。
2)将背景图像作为内联图像或div放置在主体元素中。设置图像(或包含div)为位置-固定的低z指数.这解决了iOS问题，并在我测试过的所有浏览器上正常工作，除了IE10上的触摸滚动。背景图像“抖动”或在滚动过程中上下闪烁几个像素。一旦滚动结束，所
浏览 0提问于2013-05-07得票数 4
我有我正在布局的网站。它基本上是页眉，内容和页脚都是100%宽的。我想让背景图像填充内容部分的屏幕。我用CSS3实现了这一点--背景尺寸:封面。当我放大到2560px的屏幕时，唯一的问题是图像被切断了。有没有办法解决这个问题，避免这种情况发生？
我的CSS
#maincontentcontainer {
width: 100%;
background-image: url(../images/sandpiperBG.jpg);
background-position:center center;
background-repeat:no-repeat;
浏览 2提问于2014-02-06得票数 4
2回答
我有一个网站，需要一个‘右下角’背景图像对齐，以及背景颜色#000。
我的css测试在我已经尝试过的所有操作系统和浏览器( chrome，即moz，safari)上都是正常的，除了android上的chrome，它在浏览器窗口之外呈现背景图像。其他图像对齐工作正常-问题似乎只在右下角对齐，而只有在android上的铬。
问题页面url：
CSS如下：
body {
box-sizing: border-box;
margin: 0;
padding: 0;
font-size: 1em;
background: url("../images/b
浏览 4提问于2017-09-17得票数 0
回答已采纳
我正在尝试使用元素的内容作为页面背景。我可以让它在浏览器窗口的长度内正常工作，但是一旦内容滚动，div就会停止。
html：
<html><head><title></title></head>
<body>
<div id="background"></div>
<div id="content" style="height:900px;">Lorem Ipsum
<br />...an arb
浏览 0提问于2013-01-25得票数 1
我正在使用基于%的定位来对齐CSS中的背景图像：
li a{
background:url(icons/arrow.png) no-repeat 95% 50%;
}
我经常在响应式网站上使用它，但我想把这些图片组合成一个精灵。
但是，如果我使用精灵，百分比将相对于整个精灵图像，似乎我不能再以同样的方式使用我的background-position。
还是真的有？
浏览 0提问于2012-10-02得票数 0
回答已采纳
2回答
如何使用CSS为页面背景和DIV和表格背景拉伸背景图像…因此，如果窗口大小改变，背景图像大小应该相应地拉伸(扩展/收缩)...
浏览 3提问于2010-10-13得票数 2
1回答
我试图在Bootsrap的帮助下创建一个响应式站点，但遇到了一些问题(由于缺乏经验)。
主要的想法是创建一个简单的Bootstrap corousel，它应该是一个固定的或稍微移动的背景(example - )，这样在滚动页面之后，其余的内容将溢出这个背景。
我现在拥有的是- HTML：
<header id="myCarousel" class="carousel slide">
<!-- Indicators -->
<ol class="carousel-indicators">
浏览 0提问于2015-11-27得票数 0
2回答
我需要为<img src="image.jpg"/>列表设置背景图像。我只能使用这个css来显示背景图片：
img{
background:url(../images/background.jpg) no-repeat;
width:300px;
height:240px;
display:block;
}
然而，我的一些<img src="image.jpg"/>没有300:240的图像比例，它们被扭曲了。有没有其他方法可以显示背景，而不会使图像失真？
浏览 0提问于2014-04-11得票数 0
5回答
我有Drupal 7.14和Zen 7.x-5.1。我不知道如何简单地改变背景色。我尝试过将background: red;放置在几个css页面中，但是没有运气。
浏览 0提问于2012-06-18得票数 0
2回答
引导模态启用背景
、、、、
我希望我的引导模式是打开的，但页面的背景仍然是可点击的。
在web上有一些可用的解决方案和堆栈溢出(比如)，我试过了，但是我无法让它工作。我正在使用火狐和IE11。
我试图实现的：在页面的一侧设置一个打开模型的按钮，处理模型内容，关闭模式，要么点击标题中的按钮，要么点击打开模态的按钮。
有一个，我在那里尝试适应的东西，到目前为止，没有多少成功。
这就是我有多远：
模态
(下面的html是在javascript中生成的，我只是给出了更好的可读性输出)
<div id="bootstrapModal" class="modal fade" tabindex=
浏览 1提问于2017-02-14得票数 5
回答已采纳
1回答
我目前正在为一个朋友的基本网站工作谁想要一个简单的博客/网站，并有一个快速的CSS问题。
是当前的域，如果背景很好，并且覆盖整个屏幕。这是因为内容框不够长，无法扩展页面。如果您单击“blog”选项卡，您将看到如果内容框扩展了背景，它只会进入空白。基本上，我要问的是，当你滚动它时，它只滚动内容框，而不是整个网页？它可能甚至不可能在HTML或CSS，所以如果是，请告诉我。
谢谢(=
浏览 0提问于2013-09-19得票数 0
回答已采纳
1回答
我有一个背景图像用于CSS雪碧图
现在的问题是，我只能使用流体布局(只有%，没有px)，而%定位在调整浏览器大小时会产生问题(例如，显示其他箭头的某些部分)
我该如何解决这个问题？我能得到一个如何使用% positioning作为背景的例子吗？
浏览 2提问于2011-10-18得票数 4
回答已采纳
2回答
好的，我的背景设置如下：
HTML
<div id="container">
<div id="content">
CONTENT HERE
</div>
</div>
CSS
#container
{
background:url(image.gif);
}
#content
{
width:800px;
margin:auto;
}
所以我的想法是将内容放在800px的框内，而内容的背景跨度为100%，我为不同的区域设置了相同的设置，如页眉、页脚和页面的主要部分。
浏览 4提问于2010-03-11得票数 3
回答已采纳
1回答
我在这个网站上做了一个很好的搜索，我找不到关于这个问题的参考，这不是以前发生过的事情。
通过更新css重新设计我的网站。试验地点在这里：
css在这里：
我正在浏览Chrome 61.0.3163.100和OSX的Safari 11.0。
除了一些设计风格的东西，唯一有背景定义的元素是主体，这样背景图像就可以通过所有的div显示其中的内容，并且它可以很好地处理文本。然而，一旦我添加一个图像到任何div，它就会获得背景颜色。在页脚中可以在new_index.php上看到，但在这里更明显：
我遗漏了什么？
浏览 1提问于2017-10-26得票数 0
回答已采纳
1回答
在移动浏览器视口的底部，页脚的背景色不断被切断。平板电脑也是如此，但只有当平板电脑水平转动时才会发生这种情况。我已经尝试了我在网上找到的所有问题和其他相关问题来解决这个问题。在我打开我的笔记本电脑屏幕之前，有人有什么建议吗？您可以在www.lamarplaterimages.com上查看该网站。我在我的iPhone 11和iPad专业版上浏览这个网站。 这是默认的页脚CSS footer {
background-color: #133e68;
margin-bottom: 0;
padding-bottom: 0;
bottom: 0;
} 这是375px媒体查询的CSS。 footer
浏览 13提问于2020-07-26得票数 1
我正在编辑Wordpress主题的css (twentyten)
这是我的HTML结构：
<body>
<div id="wrapper">
<div id="header"></div>
<div id="main">
<div id="filtri_di_ricerca"><img></div>
<div id="container
浏览 3提问于2013-03-26得票数 3
我注意到现在互联网上的许多版面都有这个错误。
访问该网站。
调整浏览器的大小，以便您必须水平滚动。
向右滚动时，背景图像将被剪裁。
有没有人知道一些css技巧，可以在缩小浏览器时将背景去掉？
浏览 3提问于2011-01-16得票数 2
回答已采纳
我使用的是Bootstrap css v2.2.2版和旧版本的bootsrap.js。bootstrap模式弹出窗口不会滚动，而背景内容会滚动。即使在响应式视图中，模式也会被剪切。无法查看内容。
浏览 5提问于2016-11-08得票数 2
2回答
希望在整个站点后面显示200*200的背景。我有一个div，#sidebar，和另一个div，#main，在body。我只想在#main上显示背景。下面是我为实现这一目标而编写的CSS：
#main{
background-image:url('images/bg02.png');
}
它可以工作，但当你到达底部，哪里没有内容，你可以看到默认的白色背景。要查看这一点，请查看我的测试站点，在搜索栏中输入随机字母，并注意到现在可以看到白色背景，因为#main中没有内容。
如何使背景溢出，使其仍然可见，即使没有内容？
浏览 3提问于2013-07-28得票数 0
回答已采纳
我正在尝试创建一个游戏，其中用户看到的第一件事是在游戏背景之上的开始菜单模式。
基本HTML：
<div class="game-board">
<div class="menu"> </div>
</div>
CSS：
html, body{
min-height:100%;
}
.game-board{
background-image: url(../images/sand.png);
width: 1260px;
height: 100%;
}
.menu{
浏览 0提问于2015-07-14得票数 0
4回答
您知道，可以使用以下方法将图像添加为文本区域的背景图像：
textarea {
background:#fff url(background.png) no-repeat center scroll;
}
如何将文本(不是图像，文本作为图像)作为文本区域的背景？
--它不是文本区域本身包含的文本，而是。后面是一些文字。用户可以在文本区域中写入，就像背景图像一样，查看后面的背景文本。
CSS2首选，CSS3和js都可以。
浏览 2提问于2013-05-14得票数 4
回答已采纳
我只是有点迷惑，我不明白为什么当内部div更大的时候，容器div的高度不会改变。在下图中，doctorAppointments(紫色背景)是容器div，slotWrapper(选定背景)是高度较大的内部div。 ? 下面是CSS： .doctorAppointments{
margin-left: auto;
width: 100%;
max-width: 500px;
min-width: 480px;
display: flex;
flex-direction: column;
align-items: center;
浏览 29提问于2020-11-11得票数 0
2回答
我试图使用background属性将背景图像添加到我的html中，但它在浏览器中显示无效。我寻找的错误和有同样的问题。还是找不出问题。
下面是我的css代码：
#showcase {
background: url("../img/showcase.jpg") no-repeat top center fixed/cover;
position: relative;
min-height: 650px;
color: #fff;
padding-top: 6rem; }
浏览 7提问于2019-12-28得票数 2
回答已采纳
1回答
背景图像不是很灵敏
、、、
有一个指向我的测试页面的链接
问题是，当我尝试调整小设备的大小时，背景图像没有正确覆盖页面，页面底部缺少图像。
我的CSS在head部分。提前感谢你对我做错了什么的任何建议。
浏览 3提问于2016-08-09得票数 0
1回答
我的结构如下：
<div class="box blue">
<div class="box red">
</div>
<div class="box green">
</div>
</div>
基本上，有些盒子可以包含其他的盒子。
现在我想存档，如果有人点击父框(蓝色)，背景就会变成白色。
但是，如果有人单击子框(红色)，红色的子框的背景应该变成白色。
我尝试了以下几点：
$('.box').click(function(
浏览 3提问于2014-01-06得票数 1
回答已采纳
1回答
我有一个元素填充整个页面，其中包含一个适合它的背景图像：
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: url(path/to/image.jpg);
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
如果图像比屏幕大，它会很好地缩小以适应窗口。但是，如果图像小于屏幕，则会展开图像。我不想把背景图像放大。
我知道我可以通过获取图像的大小和调整容器的CSS来解决这个问题，但我
浏览 9提问于2014-05-09得票数 1
回答已采纳
1回答
背景图像重复-x或y对我不起作用。
HTML：
<div id="box">
<div class="t"></div>
<div class="m"></div>
<div class="b"></div>
</div>
CSS：
#box{width:220px; height: 230px; margin:0 auto; }
#box .t {width:220px;height:40px; margin:0 auto;ba
浏览 1提问于2012-03-08得票数 0
2回答
我有一个在CSS3文件中分配了背景图像的div。图像是响应性的，因此它根据屏幕大小进行缩放，但容器在所有屏幕大小下都会保持高度。
我需要知道是否有一种方法可以使容器响应和背景图像一样好。
HTML：
<div class="responsive> </div>
CSS3：
.responsive {
background: url('https://s20.postimg.org/o09gf7fvx/bag.jpg') no-repeat center top;
border: 1px solid red;
backgro
浏览 0提问于2016-06-24得票数 0
回答已采纳
我正在尝试使用css使html元素具有背景图像，但是如果没有文本，背景就没有背景图像。
CSSS -
#box {
background url(.....)
}
HTML -
<div id="box">something</div> // this works bu it shows the text
<div id="box"></div> // this is what i want not text just the background url from #box
谢谢
浏览 2提问于2012-08-07得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
