<img>物上移動的Safari

JSBin夾住由1px的。當手機處於水平模式時，它將恢復正常。<img>物上移動的Safari

代碼：

img { 
 
    width: 100px; 
 
    height: 100px; 
 
    border-radius: 50%; 
 
}

<img src="http://www.duoziwang.com/uploads/1602/1-160221222J70-L.jpg" alt="">

有時縮放時夾子發生在底部，。

它是這樣的：

野生動物園圖像邊界半徑錯誤 safari image border-radius bug

設備信息：10.3.1的iOS 6 iPhone 無法在我的iPhone 7

來源

2017-05-08 0rangeT1ger

如何，而不是邊界半徑約，直接img元素，這樣做是爲了包裝。像這樣https://jsfiddle.net/yknok9nz/1/ –

可能的重複[Safari和移動Safari渲染與radius和填充不正確的圓形邊界？]（http://stackoverflow.com/questions/14444806/are-safari -mobile-safari-rendering-rounded-borders-with-radius-and-padding-inc） – shaochuancs

上面的兩條評論都沒有解決我的問題。剪輯仍然存在。 – 0rangeT1ger

在Safari裁剪反覆發作可是由於您使用的Safari版本。在Safari中，border-radius的百分比值僅在5.1+中受支持。我討厭認爲你的版本就是這種情況，但是，這是可能的。但是在我的結尾（Safari 11.0.2），它是通過無裁剪來實現的。

由於您的寬度和高度是固定的，因此安全性是將固定border-radius的百分比換算爲50px。

img { 
 
    width: 100px; 
 
    height: 100px; 
 
    border-radius: 50px; 
 
}

<img src="http://www.duoziwang.com/uploads/1602/1-160221222J70-L.jpg" alt="">

來源

2018-02-15 15:05:55 Cutter

<img>物上移動的Safari

回答

相關問題