我在一些内容上使用边框.但是,我发现一个不需要的1px轮廓颜色与在background
转换父级时在边框周围添加颜色的颜色相同(至少使用scale
和rotate
).这也发生在孩子的伪元素上
.container { transform:rotate(-45deg); } .child { border:3px solid white; background:green; }
jsFiddle与...合作
我已经在最新的Chrome和IE上测试了,问题在于两者
如何在不使用box-shadow
或删除转换的情况下摆脱此轮廓?
添加一个translateZ(1px)
.container { position:absolute; top:50%; left:50%; -webkit-transform:translateZ(1px) rotate(-45deg); transform:rotate(-45deg); }
(不确定为什么这样做......)
小提琴
似乎IE需要更多修复......
.container { position:absolute; top:50%; left:50%; -webkit-transform:translateZ(1px) rotate(-45deg); transform:perspective(999px) translateZ(1px) rotate(-45deg); }
fiddle2