Android WebView邊框半徑別名

Question

在我的android模擬器上使用border-radius ，我看到這樣的丑陋：

丑陋的邊框半徑http://beautifulpixel.com/assets/5554_FastAndSmall-20100726-130326.png

無論如何，是否有讓Android通過-webkit-border-radius以更令人滿意的方式顯示圓角的方法？ 大多數現代台式機瀏覽器和Mobile Safari似乎都能消除鋸齒，但不能消除Android渲染器的鋸齒。

我真的希望我不必對圖像執行此操作，並且有一些很棒的技巧可以僅使用邊框半徑css聲明來獲得漂亮的角。

Answer 1

我確實絕對需要一些技巧來使邊框半徑在android瀏覽器上看起來更平滑，因此我想出了這個簡單而有效的解決方案。 我剛剛在CSS類中添加了如下所示的box-shadow：

-webkit-box-shadow: 0 0 1px #000;

只是將以下代碼行添加到CSS中，這是一個小問題：是的……它將針對所有-webkit瀏覽器，從而使border-radius的外觀（稍微）不那么清晰。

在撰寫本文時，我還沒有想到完美的解決方案，但是您可以很好地利用媒體查詢來限制規則，無論您使用'max-width'屬性（以限制基於其屏幕寬度（至少會長出Webkit桌面瀏覽器）或“ -webkit-device-pixel-ratio”，以根據其像素密度來定位不同的android設備：

@media only screen and (-webkit-device-pixel-ratio:.75){
/*for low density (ldpi) Android layouts */
}

@media only screen and (-webkit-device-pixel-ratio:1){
/*for low density (ldpi) Android layouts */
}

@media only screen and (-webkit-device-pixel-ratio:1.5){
/*for low density (ldpi) Android layouts */
}

致以最誠摯的問候和對每個人的良好設計。 希望我也幫助一些像我這樣絕望的android border-radius痴迷設計師;）

Answer 2

對於僅顯示一個圓，可以將轉換與-webkit-backface-visibility: hidden;一起使用-webkit-backface-visibility: hidden; 按照這個答案可能會有所幫助（盡管在低端Android設備上轉換成本很高）。

Answer 3

遺憾的是，當前的Android版本中沒有針對此的無圖像解決方案。