css - 如何使 CSS 三 Angular 形(带边框)跨浏览器兼容

标签 css cross-browser flowchart

我能够创建一个简洁的尖头流程图,如下所示:http://jsfiddle.net/R8Gx3/3/

但是,主要浏览器(Chrome、Firefox、IE)的渲染效果并不一致。

对于如何以更可靠的方式实现相同的效果有什么想法吗?

显然我可以使用图像,但我更喜欢尽可能使用 CSS,因为在 CSS 中编辑颜色(而不是创建新图像)更容易。

我不能只使用三 Angular 形字符,因为元素后面有纹理背景,所以我需要透明度。

最佳答案

我认为,放置 UTF-8 三 Angular 形(一端两个、另一端一个)会比依赖 border-hacks 更顺利。

http://www.fileformat.info/info/unicode/char/25bc/browsertest.htm

http://en.wikipedia.org/wiki/Geometric_Shapes

关于css - 如何使 CSS 三 Angular 形(带边框)跨浏览器兼容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10727244/

相关文章:

javascript - Angular 2 - 流程图/序列图 - 库

python - ryu 在将流添加到交换机后使用交换机处理数据包

javascript - 用于更改默认搜索引擎的脚本(无论是否安装浏览器插件)

html - 汉堡图标 : buns+burger same size despite pixel alignment?

html - 中心导航栏

html - div高度自动增加

javascript - 禁用浏览器状态栏文本

javascript - exception.lineNumber 在谷歌浏览器和 Internet Explorer 中返回 "undefined"

R Markdown : How do I make text float around figures?

html - 将内部 div 不透明度设置为 1,但不受影响