只有CSS的特殊三角形（所以我可以改变边框颜色）？

Question

我有一种语音气泡：http://screencast.com/t/xy3xPHYlM带圆角，左边有一个三角形（取决于:nth-child(odd/even)）。 border和border-radius没有问题的边框和圆角。但我也希望三角形也是CSS，所以我可以改变整个东西的边框颜色。目前，三角形是两个三角形（左和右）的精灵。

我知道三角形可以用CSS（2偶数）：http://jsfiddle.net/rudiedirkx/eDdZb/但是那些甚至看起来都不像。任何使三角形看起来像截图中的三角形的方法？我更喜欢只使用:before和:after元素，但如果需要，我可以添加更多元素。

You can edit this fiddle if you'd like to try.

Answer 1

如果它是纯CSS，它必须有一个直角。没办法（我知道）。如果这不是问题，那么使用其中两个，一个是暗线，一个打火机在顶部，一个像素更小，以掩盖它。

这听起来很像你想要一些SVG作为用简单易配置的颜色绘制线条的最简单方法。它会使你的标记混乱一些，这听起来你正试图避免。

编辑：如果您允许自己使用额外的非语义元素来设置边框样式，则可以管理箭头。 See fiddle - 也很容易适应Chrome等工作。