強制Firefox在CSS指定的尺寸範圍內渲染空圖像

除FF以外的所有主流瀏覽器都會渲染圖像，其CSS尺寸或寬度/高度屬性指定尺寸範圍內的圖像的無效src屬性。只有FF會渲染alt屬性，因爲它是文本節點，忽略維度，這在很多情況下會破壞佈局。強制Firefox在CSS指定的尺寸範圍內渲染空圖像

有沒有辦法強制FF在指定的尺寸內渲染圖像？

來源

2013-01-18 cincplug

碼？例？截圖？什麼？ – Kyle

不知道，但你有沒有嘗試添加'display：inline-block'到圖像css？也許當FF將其轉換爲文本節點時，它在功能上與「span」相同並忽略「width」和「height」css？ – Bazzz

嘗試寫width:和img標籤本身height屬性或CSS使用!important爲width和height

來源

2013-01-18 10:09:49 Milind

是的，謝謝。設置屬性不起作用，但在CSS中進行聲明時添加！重要，它使溢出：hidden。 – cincplug

！重要聲明是有史以來創造的最糟糕的想法之一，我不敢相信有人會這麼說。相反，用適當的方法解決根本問題！重要的標記是專爲無限開發人員創建的。 – andreszs

嘗試添加該規則的CSS：

@-moz-document url-prefix(http), url-prefix(file) { 
    img:-moz-broken{ 
    -moz-force-broken-image-icon:1; 
    width:100px; 
    height:100px; 
    } 
}

jsfiddle sample

從源代碼：https://stackoverflow.com/a/6744791/1915183

來源

2013-01-18 10:18:01

我用'display：inline-block'組合了'：-moz-broken'。適合我！ – Moss

偉大的建議，我總是想要回破碎圖像的圖標，這使得它很容易找到他們很快......謝謝。最好從CSS中刪除寬度和高度，並使用每個圖像的自身寬度和高度屬性。 – andreszs

你應該改變的DOM元素表示

img{ 
display:block; 
}

或

img{ 
display:inline-block; 
}

或

img{ 
float:left; 
}

來源

2013-02-15 13:46:09 Evgeny

強制Firefox在CSS指定的尺寸範圍內渲染空圖像

回答

相關問題