问题标签 [background-image]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
8 回答
45558 浏览

asp.net - 在 .css 文件中引用应用程序相对虚拟路径

假设我的应用程序根目录下有一个“图像”文件夹目录。如何从 .css 文件中使用 ASP.NET 应用程序相对路径引用此目录中的图像。

例子:

在开发中,~/Images/Test.gif的路径可能会解析为/MyApp/Images/Test.gif,而在生产中,它可能会解析为/Images/Test.gif(取决于应用程序的虚拟目录) . 显然,我希望避免在环境之间修改 .css 文件。

我知道您可以使用 Page.ResolveClientUrl 在渲染时动态地将 url 注入控件的 Style 集合中。我想避免这样做。

0 投票
6 回答
4169 浏览

html - 居中的背景图像偏离 1px

我的网页位于一个 960px 宽的 DIV 中,我使用以下代码将这个 DIV 置于页面中间:

我需要将 html/body 的背景图像平铺在页面中间,但是如果浏览器中的可查看窗格的像素宽度为奇数,则居中的背景和居中的 DIV 不会对齐在一起.

这只发生在FF中。

有人知道解决方法吗?

0 投票
6 回答
2390 浏览

css - 什么会导致 Internet Explorer 6 中的图像加载间歇性问题?

我正在处理的网站出现问题,其中图像和背景图像无法在 Internet Explorer 6 中加载。

以下是您可能会遇到此问题的页面示例:

示例页面

到目前为止,我已经研究了以下可能的问题,并且几乎排除了它们:

  • 图像文件中的 XML/无关数据(google photoshop 7 Internet Explorer)
  • 损坏的图像文件

我没有排除无效标记。

我注意到在报告此问题的大多数页面中都存在验证错误,我正在努力在适当的情况下修复这些错误。

我看到的行为是页面将加载并且除背景图像之外的所有元素都会呈现。没有抛出 javascript 错误。使用 Fiddler 时,不会请求图像。如果浏览器直接指向背景图像,缓存被清除,然后浏览器指向 HTML 页面,背景图像将加载到 HTML 页面中。

是否有人对解决此问题的方法有任何其他建议?

0 投票
13 回答
377120 浏览

html - 如何拉伸背景图像以覆盖整个 HTML 元素?

我正在尝试获取 HTML 元素(body、div 等)的背景图像以拉伸其整个宽度和高度。

运气不太好。除了作为背景图像之外,它甚至可能还是我必须以其他方式做到这一点?

我目前的CSS是:

提前致谢。

编辑:我不热衷于维护 Gabriel 建议中的 CSS,所以我改为更改页面的布局。但这似乎是最好的答案,所以我将其标记为这样。

0 投票
1 回答
6227 浏览

css - Div 背景不与 Div 定位

我有几个我使用类和 ID 设置样式的 Div,他 div 本身是空的,因为它们只是其背景的占位符。示例分区:

然后我使用这个 css 为它们设置样式:

只要 Div 位于文档的左上角,图像就会正确显示,但是当 Div 放置在页面上的其他位置时,图像会保持(不可见)在页面的左上角,仅显示与div(在示例中,这将是图像的底部)。

编辑 我试图在不影响我的其他布局的情况下定位这些 Div,它们位于其他布局的后面。除了背景图像不跟随 divs 位置这一事实之外,这有效。
所以基本上我的问题是,为什么 ranImg1 div 定位的背景不是 div 而是留在左上角,以及如何解决这个问题?

0 投票
8 回答
406256 浏览

css - 我可以使用 CSS 制作多个背景图片吗?

是否可以有两个背景图像?例如,我想让一个图像在顶部重复(repeat-x),另一个在整个页面上重复(repeat),其中整个页面上的图像在顶部重复的图像后面。

我发现可以通过设置html和body的背景来实现两张背景图片想要的效果:

这是“好”的 CSS 吗?有没有更好的方法?如果我想要三个或更多背景图像怎么办?

0 投票
31 回答
423975 浏览

html - 何时使用 IMG 与 CSS 背景图像?

IMG在什么情况下使用 HTML标签来显示图像比 CSS更合适,background-image反之亦然?

因素可能包括可访问性、浏览器支持、动态内容或任何类型的技术限制或可用性原则。

0 投票
21 回答
875812 浏览

html - CSS 显示调整大小和裁剪的图像

我想显示来自具有特定宽度和高度的 URL 的图像,即使它具有不同的大小比例。所以我想调整大小(保持比例),然后将图像剪切到我想要的大小。

我可以使用 htmlimg属性调整大小,也可以使用background-image.
我怎样才能做到这两点?

例子:

这个图片:

在此处输入图像描述


有大小800x600像素,我想像200x100像素图像一样显示


img可以调整图像大小200x150px


这给了我这个:


并且background-image我可以剪切图像200x100像素。

给我:


我怎样才能做到这两点?
调整图像大小,然后将其剪切成我想要的大小?

0 投票
7 回答
13081 浏览

javascript - 延迟加载某个css背景图片

在这样的 CSS 中:

有没有办法延迟加载#big-menu背景图像,以便它在其他所有内容之后加载,包括 HTML 中的所有图像,以及所有其他 CSS 背景(some-menusome-other-menu)。

原因是,big-menu.jpg 的大小很重,我希望它最后加载。毕竟,它只是一种养眼,还有其他背景图像比这更好用。(例如按钮中使用的那些)

将它放入 CSS 中的顺序或#big-menuHTML 中标记 () 的出现是否与首先加载的内容有关?还是有更可靠的方法来控制它?javascript(首选jQuery)很好。

0 投票
6 回答
13958 浏览

css - IE6 background-position(?) issue

I apply to stackoverflow as my last resort. I got this ie6 bug while using the image at the background of the link. It seems that ie6 scrolls the background. How can I avoid it?

At some width it shows like this:
alt text http://img135.imageshack.us/img135/8849/badie1.png

And at some other it shows like that:
alt text http://img522.imageshack.us/img522/8180/badie2.png

IE7 & FF show this just like I expect:
alt text http://img142.imageshack.us/img142/2296/goodie.png
The links are placed inside the div which is floating to the right.

Any hints how can I avoid this?