css不同浏览器不同属性值

在开发网页时，我们经常会遇到不同浏览器对CSS属性值的支持情况不同的问题。这个问题在不同浏览器之间的表现各不相同，可能出现的情况有：

  <!-- 在Safari和Chrome的浏览器中，border-radius的半径必须设置两次 -->
        <div style="width: 100px; height: 100px; border-radius: 50px; -webkit-border-radius: 50px;"></div> 

在这个例子中，我们发现Safari 和 Chrome 的浏览器需要给 `border-radius` 和 `-webkit-border-radius` 都设置属性值，否则可能出现圆边框无法显示的情况。

在实际开发中，我们还需要考虑到其他浏览器的支持情况，比如旧版IE浏览器，它们对CSS3新特性的支持非常有限。

  <!-- 在IE浏览器中，transform属性不支持 -->
        <div style="width: 100px; height: 100px; background-color: red; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg)"></div> 

在这个例子中，我们发现IE浏览器不支持 `transform` 属性，为了使得其它浏览器不受影响，我们需要给 `-webkit-transform`、 `-ms-transform`、`-moz-transform`分别设置属性值来实现旋转效果。

另外，在调试浏览器中的CSS时，我们可以使用`浏览器开发者工具`来查看网页元素的样式属性。这些工具包含了浏览器特定的属性前缀，可以帮助我们在开发过程中对CSS进行修正。