支付宝登录的清空历史帐号信息的按钮是怎么做的？

[fim8]

当你输入过支付宝账户后，下次登录账号框里能看到之前的帐号。点击X清空这个帐号。

看了CSS半天摸不到头绪。

<span class="chacha"></span>

https://static.alipay.com/build/css/home/home-index.css

只知道是由两个正斜杠和反斜杠组成的。没有找到相关的样式表。。

[aligo]

background:url(https://img.alipay.com/home/chacha.png) no-repeat -2px -3px\0;

[Sai]

制作人员太喜感了，「叉叉」。

[fim8]

.chacha {
display: block;
text-indent: -9999px;
background: #efefef;
background: url(https: //img.alipay.com/home/chacha.png) no-repeat -2px -3px\0;
width: 17px;
height: 17px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
cursor: pointer;
position: absolute;
top: 60px;
left: 189px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.chacha:before,.chacha:after {
content: "";
display: block;
display: none\0;
width: 3px;
height: 11px;
position: relative;
left: 7px;
top: 3px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background: #bcbbbb;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.chacha:after {
top: -8px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.chacha: hover {
-webkit-box-shadow: 0 0 4px #aaa;
-moz-box-shadow: 0 0 4px #aaa;
box-shadow: 0 0 4px #aaa;
}

整理了一下，出现了\0所以FIREBUG没读取，但是火狐本身却显示了出来。
一个小图标整这么多代码，是想表达什么呢？难道没有更简单的方法吗？

[gonghao]

\0是让IE系浏览器使用，其他浏览器没用背景图片实现效果，因此代码比较长~LZ静下心来慢慢看吧~

[lychee]

最简单的方法是用图片..但是为了节省一个http请求或者是sprit的大小 所以用了这么极端的用元素模拟
.chacha是圆背景
.chacha:before, .chacha:after 是两个伪元素 一个45度左旋 一个45右旋 组成一个X