问题标签 [background-image]

是否可以将图像用作 Cocoa 中文本字段的背景？如果是这样，怎么做？

我正在尝试在更改徽标 div 的背景图像的 mootools onclick 事件之后在 ie6 中呈现 .png 背景图像。

这是刚刚的相关代码-

无论出于何种原因，这似乎都不起作用！该事件被调用并且适用于所有其他浏览器，但在 ie6 中运行时徽标只是空白。

如果有人能对此有所了解或有任何想法，我将不胜感激。

干杯，彼得

一些用户报告说我的网站太慢了我认为 css 中的背景图片可能是罪魁祸首

我有一个使用自定义构建系统连接所有 css、压缩它们（yui 压缩器）、自动制作 css sprites（smartsprites）的站点，我最终得到了整个页面的 9kb CSS，这包括背景图像的所有 css最后是 d 他们大约 60 岁（几个去同一个精灵不知道有多少）

我想知道浏览器的默认行为是根据需要下载图像（当它们与选择器匹配时）或全部下载。

现在firefox中的firebug似乎表明它们都已被下载。你会建议我用什么技术来避免这个问题，或者减轻它。

编辑：我误读了萤火虫，正在下载的图像属于隐藏的 lightview，但背景图像与 dom 匹配。

我有一个使用大图像作为背景的网页。我希望在下载图像后使用 jQuery 加载图像（基本上是 bing.com 加载其背景图像的方式）。jQuery可以做到这一点吗？如果是这样，是否有您推荐的插件？

我正在尝试设置一个随机交替的背景，该背景会在整个站点上定期更改。例如，在任何给定点，随机背景图像在一段时间内在每个页面上都是相同的。

目前我的背景图片每 30 分钟用这个 javascript 改变一次：（来自这里： http: //www.blogfodder.co.uk/post/2008/01/JavaScript-CSS-Random-Background-Image.aspx）

然而，问题是每个链接都会随机化每个新页面上的背景。

我需要帮助 。它在 Firefox 或 Opera 中工作正常。问题出在即。我尝试将其放入样式文件或内联样式但不生效。

出于某种原因，如果您为文本框提供背景图像，大多数现代浏览器将停止将其默认输入边框样式应用于文本框。相反，你会得到那种丑陋的插图风格。据我所知，也没有 CSS 方法可以应用默认浏览器样式。

IE 8 没有这个问题。Chrome 2 和 Firefox 3.5 可以，我假设其他浏览器也是如此。从我在网上阅读的内容来看，IE 7 也有同样的问题，但那篇文章没有解决方案。

这是一个例子：

在 Chrome 2 中，它看起来像这样：http ://www.screencast.com/users/jadeonly/folders/Snagit/media/d4ee9819-c92a-4bc2-b84e-e3a4ed6843b6

在 Firefox 3.5 中：http ://www.screencast.com/users/jadeonly/folders/Snagit/media/d70dd690-9273-45fb-9893-14b38202ddcc

更新：JS 解决方案：我仍然希望找到一个纯 CSS-on-the-input 解决方案，但这是我现在要使用的解决方法。请注意，这是从我的应用程序中直接粘贴的，因此不是像上面那样好的独立示例。我刚刚从我的大型网络应用程序中包含了相关部分。你应该能够得到这个想法。HTML 是带有“链接”类的输入。大的垂直背景位置是因为它是一个精灵。在 IE6、IE7、IE8、FF2、FF3.5、Opera 9.6、Opera 10、Chrome 2、Safari 4 中测试。我仍然需要在某些浏览器中调整几个像素的背景位置：

JS：

CSS：

更新：CSS 足够接近 解决方案：根据 kRON 的建议，这里的 CSS 可以使输入与 Vista 中的 FF 和 IE 匹配，如果您决定放弃纯默认设置并强制使用一种样式，这是一个不错的选择。我稍微修改了他并添加了“蓝色”效果：

CSS：

我试过用 UIButtonTypeCustom 创建一个 UIButton。然后用下面的方法来调整它的外观

然而问题是，一旦你开始将 UIImages 设置为状态，setTitle 就不再起作用了。我认为 setTitle 仅适用于非 UIButtonTypeCustom？这意味着我要么必须将文本本身放入图像中（不是很健壮），要么将其子类化并将 UILabel 添加到视图中？听起来工作量很大:(有什么想法吗？

我有一个'main_menu' div，其中包含一个在 y 轴上重复的背景图像。在这个 div 上方，我有另一个 div 用于标题。问题是标题 div 有一个高度约为 75px 的图像。我想将 main_div 中的文本从 main_div 的背景图像实际开始的位置高出大约 50 px。

我在想类似的东西：

这真的行不通。问题是如何将文本向上移动，同时将背景图像保持在正常位置。

谢谢

{编辑}

这是CSS

这是html

所以你可以看到标题非常高。所以我想在 menu_main div 中开始文本大约高出 50px

我正在查看油脂猴用户脚本的来源，并在他们的 css 中注意到以下内容：

我可以理解，greasemonkey 脚本希望将它可以在源中捆绑的任何内容，而不是将其托管在服务器上，这很明显。但由于我以前没有见过这种技术，所以我考虑了它的用途，它似乎很有吸引力，原因有很多：

1. 它将减少页面加载时的 HTTP 请求数量，从而提高性能
2. 如果没有 CDN，那么它将减少通过与图像一起发送的 cookie 产生的流量
3. CSS文件可以被缓存
4. CSS 文件可以 GZIPPED

考虑到 IE6（例如）在缓存背景图像方面存在问题，这似乎不是最糟糕的主意......

那么，这是一个好还是坏的做法，你为什么不使用它，你会使用什么工具对图像进行 base64 编码？

更新 - 测试结果

• 图像测试：http ://fragged.org/dev/map-shot.jpg - 133.6Kb

• 测试网址： http: //fragged.org/dev/base64.html

• 专用 CSS 文件： http ://fragged.org/dev/base64.css - 178.1Kb

• GZIP编码服务器端

• 发送到客户端的结果大小（YSLOW 组件测试）：59.3Kb

• 保存发送到客户端浏览器的数据：74.3Kb

不错，但我猜它对于较小的图像的用处会稍微小一些。

更新： Bryan McQuade 是 Google 的一名软件工程师，负责 PageSpeed，他在 ChromeDevSummit 2013 上表示，CSS 中的 data:uris 在他的演讲中被认为是一种渲染阻塞反模式，用于提供关键/最小的 CSS #perfmatters: Instant mobile web apps。请参阅http://developer.chrome.com/devsum​​mit /sessions并记住这一点 -实际幻灯片