CSS:
.e-mail:before {
content: attr(data-website) "\0040" attr(data-user);
unicode-bidi: bidi-override;
direction: rtl;
}
HTML:
<span class="e-mail" data-user="otcatnoc" data-website="moc.shtopurg">
但它在IE 11上无法运行......任何关于如何修复它或者我做错了什么的想法?
任何帮助都会被贬低,谢谢
答案 0 :(得分:5)
你没有做错什么,所以不用担心。它只是IE,虽然它知道方向:rtl,忘记将它应用到:之前也是。
使其工作的一种方法是制作span rtl的容器,以便整个跨度(包括:before)得到反转。所以给p赋一个id并将样式应用到那个。
#mailbox {
direction: rtl;
unicode-bidi: bidi-override;
text-align: left;
}
.e-mail:before {
content: attr(data-website)"\0040" attr(data-user);
}
&#13;
<p id="mailbox">
<span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>
<span class="e-mail" data-user="otcatnoc" data-website="moc.shtopurg"></span>
</p>
&#13;
适用于我测试的所有浏览器(FF 3.6及更高版本,Chrome 20及更高版本,IE8及更高版本)。