我正在嘗試使用背景圖像作爲精靈,具有可變尺寸的元素。因此,我使用基於百分比的值爲background-size
和background-position
。Opera不正確地使用百分比值處理背景位置和/或背景大小?
我在戲中遇到的問題,此(最新版本,12.14)。我懷疑這是background-position
和background-size
的組合與導致錯誤行爲的基於百分比的值。我徒勞地搜尋了任何有關的信息,或一個公認的問題。
爲了演示我正面臨的問題,我創建了一個560像素,主要是橙色的圖像,除了右下角的藍色方塊,測量112乘112像素,五分之一圖像的大小。
若要將此圖片作爲背景元素,使得藍色方塊完全,準確地覆蓋,而不管元件的尺寸,我已經使用了以下樣式:
.square
{
background-size: 500% 500%;
background-position: -400% -400%;
}
這工作完全在所有的瀏覽器中,除了Opera,在元素的右邊和底邊都顯示了一些橙色。我推測這些橙片是重複的背景圖像,就好像Opera已經將圖像進一步抵消了一樣。
我已經創建a jsfiddle test that demonstrates the issue,你可以在Opera瀏覽看到我所描述的不良行爲。關於Opera
細節,從opera:about
頂部取出:
Version information
Version: 12.14
Build: 1738
Platform: Win32
System: Windows 7
Browser identification
Opera/9.80 (Windows NT 6.1; WOW64) Presto/2.12.388 Version/12.14
我已經能夠組裝一些資料,可以提供一些線索:
越大,圖像和進一步它是偏移量(即背景位置的值越大),Opera進一步錯誤。
如果元素正好是藍色正方形的大小(在這種情況下是112×112像素 - 你可以在jsfiddle中看到),Opera會正確渲染。
歌劇呈現正確如果(振奮自己)的圖像尺寸是100的倍數(即,500由500個像素,而不是560由560個像素)。
目前,我猜這是Opera中的一個錯誤,因爲它在所有其他瀏覽器中按照需要工作。我的問題是:
這是一個公平的假設,或者甚至是一個已知的問題? Opera是否違反相關規範?
是否有修補程序或變通方法,比其他的重新渲染的圖像尺寸是100的倍數?