问题标签 [background-size]
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.
html - IE11 不支持不成比例的背景大小
我正在尝试获取背景 .jpeg 图形以自动缩放到 DIV（lineholder）的高度，而不考虑子 DIV（链接持有人）的数量 - 同时让一些文本在父 DIV 内垂直对齐。
该代码在 Chrome 和 Firefox 中 100% 工作 - 但 IE11 完全忽略了背景大小。
我的 HTML 标记如下所示：
CSS：
IE11 仅在我的 lineholder 左上角显示原始背景图像 - 而所有其他浏览器都会扩展高度以适应 DIV。
在此处查看图片http://6710.sunnysite.dk/background-size_debug.jpg
background-image css 位于 html 内部，因为现在完全了解 HTML CSS 的人需要插入更多具有不同背景图像的单独线夹；）所以不同的类等不是一种选择。
css - 使用背景大小作为图像分隔符的正确方法？
我需要将 hr 转换为图像分隔符，并且我正在使用以下代码：
和
不幸的是，它只显示了一个大量拉伸的图像，如下所示：http: //i.imgur.com/MyXa07k.png
显示图像的正确方法是什么，它看起来像这样：http: //i.imgur.com/zbXujxP.png
css - CSS：使响应式导航栏中的背景图像链接响应和缩放
为客户在视差 WordPress 网站上工作，我有一个导航栏，其中有一个精灵用于每个链接的背景图像。您可以在此处查看七个链接导航栏 ( http://www.aishla.com/blog/2014/my-aish-test/ )。现在它在桌面上看起来很棒，但我想让这些图像响应。换句话说，随着设计变小而变小。
所以我想我可以在 CSS 中使用 background-size 设置，但是当我尝试在我的媒体查询中时，我得到了 a href 中的整个精灵，而不仅仅是我想要的图像部分。所以我想知道这是否有可能以这种方式完成，或者我是否坚持为不同的屏幕分辨率创建一系列精灵。这是我用来尝试完成这项工作的示例：
首先关闭桌面版本：
现在媒体查询 fior max-width 768px：
html - CSS 背景尺寸属性
我想为我的网站添加全尺寸背景，最好只使用 CSS 属性background和background-size. 目前我正在使用以下
然后<body class="bg">应用它。问题是，如果窗口变得非常窄，我使用的横向背景图像只会覆盖一小部分，因为它会将自身缩放到 100% 的宽度。无论如何我可以让它使用100 % 的宽度或 100% 的高度，以一种永远不会留下任何白色背景的方式？我为此找到了一些指南，但它们都涉及相当“丑陋”的代码。
奖励请求：最好使用支持旧浏览器（如 IE9）的代码
html - 视频的宽度不能正确缩放
我有一个小问题。我有一个视频，我想根据浏览器进行调整，它不应该拉伸，但也不应该有任何可见的空间
HTML：
CSS：
background-size: cover;导致视频偏离中心的问题，有没有其他方法可以覆盖浏览器的整个宽度和高度？目前width: 100%并height: 100%没有完全解决这个问题，因为即使视频正确缩放，它也会让图像在左右两侧有一个白条。有没有办法解决这个问题？
css - 背景大小：在带有框架的 IE 中包含问题
我使用背景大小：包含在 div 背景图像中来保持纵横比并填充 div。
在 myfile.php
背景图像在 FIREFOX 和 CHROME 中填充了保持的纵横比，但在 IE 中存在一些问题。我在IE11上试过。
我认为框架的大小用于背景大小，因此图像根据框架而不是 DIV 进行拉伸。
css - 无法获得背景信息
所以我想要的是让背景图像保持原样（而不是根据内容的数量改变大小），让左列滚动和（如果可能的话！）右列保持不变。
internet-explorer-8 - IE8的背景大小像素polyfil？
我需要使 CSS3 的背景大小在 IE8 中正常工作。那里有很多 javascript 库，但它们扩展了“cover”和“contain”选项，而不是 px 值。当我使用图像精灵时，我需要以像素为单位设置背景大小。
这是我的代码的演示。精灵图像是 600 像素 400 像素，但我将背景尺寸设置为 300 像素 x 200 像素，这样在高密度显示器上看起来很清晰。
http://jsfiddle.net/rr2obdss/4/
我可以在不必创建和维护第二个图像精灵的情况下扩展对 IE8 的支持吗？
html - 封面背景图片与 IE 不兼容，试图找到可行的替代方案
好的，所以我有一个使用 background-size: 封面的背景图片。现在我知道 IE 不喜欢它。因此，我正在尝试实现它在此页面上讨论的一些方法： http: //css-tricks.com/perfect-full-page-background-image/使用 IE 的 CSS 文件。我希望我的 background-size:cover 对于所有浏览器都保持不变，但 IE 和一个 IE CSS 用于 IE 浏览器，因此它具有相同的外观和感觉。我尝试的解决方案不起作用。请帮忙。我的投资组合页面网址是：http ://spenry.mydevryportfolio.com/portfolio/
页眉/背景图像 HTML（我在此处添加了 Div 和 IMG 以启动我的 CSS IE，但在其他浏览器中，我在常规样式表中隐藏了此 div 的内容，因为在其他浏览器中，我的图像通过我的 CSS 显示下面作为背景大小的封面）
CSS：
这是我的 IE CSS 的 CSS - 我已经从该站点尝试了两种不同的方法，但我可能应该删除一个。但两者都没有在 IE 中单独工作，因为我都尝试过。我一定做错了什么。
html - 如何分配混合类和 id 的 CSS 背景图像属性
我想知道你们是否有任何技巧可以做到这一点，或者我是否完全想多了。
我使用了许多图像，显示这些图像的最有效（也是最简单）的方法是使用 CSSbackground:url("link");属性，该属性link是指向我的图像文件的正确链接。这也可以防止我的 html 文件混乱。
问题是上面的代码存在于 50 多个不同的 id 中，每个都指向不同的图像，我需要调整图像的大小，但是我真的希望不必将以下代码放在每个 id 下。
简单地说：我的 CSS 看起来像这样......
我的“身份证”
我的班级
请注意，通过输入此代码，一切看起来都很正常，但是如果您更改其中的值background-size（假设100px 239px您会注意到我遇到的问题）
在html中的典型用法如下：
可以在此处找到此问题的 jsfiddle：jsfiddle
预期的结果显示在小提琴中的文本下方。
我将如何进行编码以使其保持清洁？
我想指出我正在尝试将我的 CSS 和 JS分开。我正在寻找一种纯粹的 CSS 方式来编码。我需要从一个位置控制所有 id 的背景属性。
非常感谢您对此的任何帮助，谢谢。