圆角在铬不工作 [英] rounded corners in chrome not working

问题描述

大家好，我使用以下方式实现圆角...

Hi everyone i am using the following for achieving rounded corners...

-moz-border-radius： 10px;

border-radius：10px;

-webkit-border-radius：10px;

-moz-border-radius: 10px;
border-radius: 10px;
-webkit-border-radius: 10px;

这在所有浏览器（除了IE虽然除外）工作除了chrome ...这里是它在Chrome的外观

This is working in all browsers(excluding IE though) except chrome... here is how it looks in chrome

但是同一个页面在Safari浏览器中显示得很好，为什么在这两个浏览器显示之间有区别..？
这是它在safari中的样子..

为什么这是发生吗？请帮助......

but the same page is displayed fine in safari... being a webkit browsers why is there a difference in between these two browser displays..? this is how it looks in safari.. why is this happening..? please help......

这里是我使用的标记：

html：

div#one1 {
  position: relative;
  border-bottom: solid 2px #2D2DFF;
  width: 800px;
  height: 100px;
  color: #FFF;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topleft: 10px;
  border-radius-topleft: 10px;
  border-radius-topleft: 10px;
  -webkit-border-top-left-radius: 20px;
  -webkit-border-top-right-radius: 20px;
  box-shadow: inset 0 0.5px rgba(255, 255, 255, 0.3), inset 0 1px rgba(255, 255, 255, 0.2), inset 0 1px 20px rgba(255, 255, 255, 0.25), inset 0 -15px 150px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0.5px rgba(255, 255, 255, 0.3), inset 0 1px rgba(255, 255, 255, 0.2), inset 0 1px 20px rgba(255, 255, 255, 0.25), inset 0 -15px 150px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: inset 0 0.5px rgba(255, 255, 255, 0.3), inset 0 1px rgba(255, 255, 255, 0.2), inset 0 1px 20px rgba(255, 255, 255, 0.25), inset 0 -15px 150px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0.5px rgba(255, 255, 255, 0.3), inset 0 1px rgba(255, 255, 255, 0.2), inset 0 1px 20px rgba(255, 255, 255, 0.25), inset 0 -15px 150px rgba(0, 0, 0, 0.3);
}

<div id="one1">
  this is one event that is going to happen.....
  <br />and then the other.......
  <br />
</div>

推荐答案

这是Skia图形库利用Chrome。它可以在Windows和Linux中重现...

This is a bug with the Skia graphics library that is leveraged by Chrome. It's reproduceable in Windows and Linux...

但从今天起，它是固定的，可在开发渠道中使用！ （这是稳定频道中的所有人都将在4到10周之间）

but as of today, it's fixed and available in the dev channel! (It'll be between 4 and 10 weeks when it goes to everyone in the stable channel)

更多详情：http://paulirish.com/2011/chrome-inset-box-shadow-bug-fixed/

这篇关于圆角在铬不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！