随着网页设计的不断发展，添加一些特效已经成为了网页设计必不可少的一部分。其中，投影效果是最常用的效果之一，可以让文字和图片看起来更加立体和生动。然而，由于不同的浏览器解析方式和支持度不同，将CSS投影效果实现成为了一个不可避免的问题。

要实现CSS投影效果，我们需要使用CSS3中的box-shadow属性。box-shadow属性可以让我们添加投影效果，并且可以通过调整属性值，实现不同类型的投影效果。基本语法如下：

shadow{inset} h-shadow v-shadow blur spread color;

其中，参数的含义分别为阴影水平位置、阴影垂直位置、阴影模糊半径、阴影扩展半径和颜色。如果想添加多个投影效果，需要用逗号分隔，如：

box-shadow: 10px 10px 5px #888888, -10px -10px 5px #888888;

然而，要在所有浏览器上实现兼容性，就需要添加一些前缀，如-webkit-、-moz-、-o-。例如：

box-shadow: 10px 10px 5px #888888;
-webkit-box-shadow: 10px 10px 5px #888888;
-moz-box-shadow: 10px 10px 5px #888888;
-o-box-shadow: 10px 10px 5px #888888;

另外，要注意不同浏览器对于box-shadow属性的支持度不同。例如，对于IE8及以下的版本，无法解析box-shadow属性。这时，我们可以使用滤镜来模拟出类似的效果。

总之，要实现CSS投影效果兼容，我们需要掌握box-shadow属性的基本语法和添加前缀的方法，也需要了解不同浏览器对于box-shadow的支持度不同，有时需要使用滤镜来模拟。