问题标签 [background-size]

目前，我正在使用以下代码：

CSS

PHP 和 HTML

以下是该代码的外观（将浏览器窗口调整到 750 像素以下以查看它）： http: //mitt-galleri.nu/P1290364。

使用此解决方案，DIV无论窗口大小如何，图像的高度始终与图像一样高。我想DIV根据图像的高度设置（不仅是图像）的高度。我已经测试过min-height: 100%，但背景颜色仍然可见。只是在DIV高度上比没有时要小min-height: 100%。

由于我使用的margin-top: '.$image_height.'px是. 根据图像的高度，我还希望它具有动态高度。photo-mediumposition: absolute

我该如何解决这个“问题”？

我正在开发一个允许我为首页插入一些自定义 CSS 的 Web 应用程序。

我想在起始页有一个全屏背景图像。我知道我可以使用所有最新版本的浏览器都支持的background-size:cover 。

这适用于最新版本的 Firefox 和 Chrome。但是，它在 IE11 中不起作用。背景图像不会缩小以覆盖整个屏幕。它以其原始大小显示并被部分裁剪。

使用 F12 进行调试，我发现如果我禁用 margin-top 或 margin-bottom（见截图）， background-size 属性将起作用。

我不想修改 web 应用程序的原始 CSS 引入的 margin 属性。有什么办法可以解决这个问题？

我在用着：

但是，1px浏览器右侧有一条我似乎无法覆盖的小线。我在 Opera、FF Dev 和 Chrome 上本地测试了我的网站——都遇到了同样的问题。

我错过了什么吗？

• 这是右侧的样子（坏）：http: //i.imgur.com/IO2oJkj.png
• 这是左侧的样子（好）：http: //i.imgur.com/54EFfgI.png

我使用以下内容用css裁剪和居中图片（对不起内联css，但这只是为了解释我的问题）

这在大多数浏览器上都可以正常工作，但我需要在 html 电子邮件中重现相同的内容，不幸的是，电子邮件客户端似乎无法识别“背景大小”。

有没有一种简单的方法可以在 html 电子邮件中裁剪图片？

谢谢你的帮助。

从本质上讲，标题说明了一切。

本质上，我希望 image1 将默认属性保持为典型背景，但我希望将 image2 设置为等效于background-size: cover;

我正在一个网站上工作，那里有一些带有背景图像作为缩略图的框。我必须使用背景图像，因为我们正在处理的 CMS 已经过时并且客户端不会改变（mon€y 是主要问题）。

我在 iPad2 和 iPhone5（最新的 iOS）上的 iOs Safari 中发现了一个奇怪的行为，但不知道为什么。

这是我的代码：

在我的桌面上，它显示了整个图像，但在 iOS 上，它看起来像是在缩略图框中显示了原始大小。我怎么解决这个问题？

任何帮助都会很棒:)谢谢

模因

is there an easy way to get the final height and width of a background image with Javascript or jQuery even if a background-size property was applied?

I mean, I know I can get the background image url and load it to an Image object and then get the width and height. But it is the size of the source image. If someone scaled it with CSS then the size changed

How can I find its final size?

@edit

it is different from the question marked as similar because it doesnt say how to get the size in pixels if someone changed the background-size

我正在使用background-size: cover;in CSS，虽然它运行良好，但我注意到一旦它“启动”，那么您可能会遇到整个height背景图像不显示的问题。

例如，我有这样的代码：

现在，min-height: 768px;指的是图像的实际高度，所以我设置它以确保它始终显示完整高度，而不管内容如何；但是很明显，一旦背景尺寸开始增加，height也会增加，因此768px尺寸不再足够大，并且没有显示很多背景。

有没有办法解决这个问题CSS，如果没有，JavaScript最好用jQuery怎么办？

如果只是一个 JavaScript/jQuery 解决方案，那么值得一提的是，我breakpoints以较小的分辨率使用和利用较小的背景图像；无需对这些应用任何内容。

编辑：为了澄清，我想知道是否有可能这样当它扩展时它总是显示图像的整个高度。因此，例如，如果它使用的图像是1600 x 768并且有人以1920 x 900分辨率查看它，那么它会扩展到1920px宽度，因此如果min-height可以更改922px为现在它的正确高度会很好？

几个小时以来，我一直在寻找一个简单的解决方案，但我找不到任何解决方案。我的问题：我有一个网站，我使用 background-size:cover 以全尺寸显示标题图片。它在每个浏览器上都可以正常工作，但在 iOS 设备上看起来很糟糕。示例：http ://www.dnu-films.ch/site/ 有什么想法吗？非常感谢！

我正在尝试实现我最近看到的效果，其中背景图像在悬停时放大。我几乎用这里的例子做到了：https ://jsfiddle.net/qyh6nbwt/但它似乎很不稳定（你会明白我的意思，将鼠标悬停在它上面），我在 osx 上运行最新的 chrome 版本，有尚未在其他浏览器中检查它。有没有办法让它更平滑，所以它不会在放大时“摇晃”？

HTML

CSS