CSS 如何翻转字形图标
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18609819/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to flip glyphicon icon
提问by Jamol
Is there any way to flip glyphicon. I found Flip an Imagecss trick, but that does not work for glyphicon. Please any suggestions
有什么办法可以翻转 glyphicon. 我发现翻转图像css 技巧，但这不适用于 glyphicon。请任何建议
回答by Falguni Panchal
Like this
像这样
HTML
HTML
<a href="#" class="btn"><i class="icon-rotate icon-flipped"></i></a>
CSS
CSS
.icon-flipped {
transform: scaleX(-1);
-moz-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
-ms-transform: scaleX(-1);
}
OR
或者
http://fortawesome.github.io/Font-Awesome/examples/#rotated-flipped
http://fortawesome.github.io/Font-Awesome/examples/#rotated-flipped
回答by Jax
Using glyphicons managed to make this work like so:
使用字形设法使这项工作像这样：
HTML
HTML
<span class="glyphicon glyphicon-search" id="my-glyphicon"></span>
CSS
CSS
#my-glyphicon {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
see JSFiddlehere
在这里看到JSFiddle
