CSS 3后臺大小不適用于IE9(CSS 3 background-size not working on IE9)

background-image:url(yellow.jpg); background-size:180px 180px; background-repeat:no-repeat;

上面提到的css在chrome上工作得很好，但ie9無法正確縮放圖像+顯示圖像

background-image:url(yellow.jpg); background-size:180px 180px; background-repeat:no-repeat;

The above mentioned css works perfect on chrome but ie9 is unable to scale images + display images correctly

原文：https://stackoverflow.com/questions/6776580

更新時間：2019-11-18 23:36

最滿意答案

你確定你的IE在IE9模式下運行嗎？ 您的代碼適用于我嘗試的任何圖像。

(F12打開開發者窗口)

Are you sure your IE runs in IE9 mode? Your code works with any image I tried.

(F12 to open developer window)

相關問答

你確定你的IE在IE9模式下運行嗎？ 您的代碼適用于我嘗試的任何圖像。 (F12打開開發者窗口) Are you sure your IE runs in IE9 mode? Your code works with any image I tried. (F12 to open developer window)

有3個限制： 一張表可能包含多達4095個選擇器，請參見http://demos.telerik.com/testcases/4095issues.html 一張表可以@最多31張，見http://demos.telerik.com/testcases/BrokenTheme.aspx @import嵌套最多支持4個級別 Microsoft支持/ MSDN參考鏈接： http://support.microsoft.com/kb/262161 http://blogs.msdn.com/b/iei

...

試試純JavaScript： function scaleImg() {

var container = document.getElementById('img_src_div');

var img = container.children[0]; // assuming image is first child

// var img = container.getElementsByTagName('img')[0]; // use this one if not

...

對我來說工作非常好，也許你不是像.jpg那樣保存圖像...... div.one {

width:100px;

height:100px;

background-image:url(http://placekitten.com.s3.amazonaws.com/homepage-samples/408/287.jpg);

background-position:center;

background-repeat:no-repeat;

ba

...

Internet Explorer 9及以下版本不支持column-count ; 在版本10之前不會添加支持。重要的是要記住，Modernizr主要用于幫助您了解瀏覽器的功能，而不是讓瀏覽器具備更多功能。 它通過添加到文檔中的特殊類以及用于腳本編寫的全局Modernizr對象來實現此目的 。 如果您想要在Internet Explorer 9中支持CSS列，則需要通過其他路徑進行操作。 我會建議jQuery Columnizer，因為我過去曾經使用它，并且它對于任何熟悉CSS Column語法的

...

在塊元素(如div )上，高度與寬度的工作方式不同。 如果未指定高度，則元素將與其內容一樣高。 這是一回事。 height: 100%如果你想讓你的div像body一樣大，那么height: 100%就是你要去的方法，但訣竅是百分比高度總是來自父親的身高 。 因此，您必須為所有父項(包括html )設置height: 100%以獲得crosss-browser結果。 html,body,#please_expand { height: 100%; }

jsFiddle演示 On block el

...

IE9是否支持CSS線性漸變？ background:#fff;

background-image: -moz-linear-gradient(top, #fff, #000);

background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #fff),color-stop(1, #000));

filter: progid:DXImageTransform.Microsoft.gradient(Gradi

...

IE9或更低版本不支持動畫，轉換和轉換。 IE 10+支持它們，但即使在這種情況下，用戶在使用IE時也會遇到很多問題。 最好的辦法是使用javascript。 使用javascript，你可以避免CSS3 animations ，甚至在IE中運行你的結果更好。 有關animations, transitions and transformations瀏覽器兼容性animations, transitions and transformations查看以下鏈接： https ： //develope

...

根據w3c 規范 ： “背景位置” 百分比 百分比X將圖像的X％對齊(對于水平)或向下(對于垂直)對齊點X％跨(對于水平)或向下(對于垂直)對象的填充框。 例如，使用值對“0％0％”，圖像的左上角與填充框的左上角對齊。 值對'100％100％'將圖像的右下角放置在填充框的右下角。 使用“14％84％”的值對，圖像的14％和84％的點位于填充框的14％和84％的位置。 這意味著您在background-position中設置的百分比指定圖像的哪個點應與元素中的相同點匹配。 但是當容器和圖像的大小相等

...

總結

以上是生活随笔為你收集整理的ie9 css过大,CSS 3后台大小不适用于IE9(CSS 3 background-size not working on IE9)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。