[分享]css做浏览器兼容

CSS，全称为Cascading Style Sheets，即层叠样式表，是一种用于定义网页上的样式和布局的语言。它可以为HTML和XML等文档添加样式，例如字体、颜色、布局、背景等，使网页看起来更加...

CSS，全称为Cascading Style Sheets，即层叠样式表，是一种用于定义网页上的样式和布局的语言。它可以为HTML和XML等文档添加样式，例如字体、颜色、布局、背景等，使网页看起来更加美观和有吸引力。但是，在不同的浏览器中，CSS的表现可能不同，有些属性甚至不被支持，因此我们需要考虑CSS的浏览器兼容性。

在编写CSS代码时，为了让不同浏览器能够正确地渲染页面，我们可以采取以下几种策略：

1.使用浏览器前缀
-webkit-：Chrome、Safari、iOS Safari、Android Browser、Blackberry Browser、Opera Mobile
-moz-：Firefox
-o-：Opera
-ms-：Internet Explorer

例如：-webkit-border-radius:5px; 

2.检测浏览器支持性并应用不同样式

例如：@media screen and (-webkit-min-device-pixel-ratio:0){/* Safari and Google Chrome */body{font-size:14px;}}

在这个例子中，使用@media查询来检测是否为Safari和Google Chrome浏览器，如果是，则将字体大小设置为14px。 

3.使用兼容性库

例如：normalize.css、Modernizr.js

这些库可以解决一些CSS的兼容性问题，并提供一些CSS3的特性的兼容性。 

总之，保持一个良好的代码组织使得我们对浏览器兼容性问题更容易维护，使用CSS编写出最简单，可读性和易于维护的代码成为我们的一个优先考虑。