这个网站是一个CSS类,用于定义图标的外观。通过使用.anticon
类,可以创建一个具有特定样式和功能的图标。
该CSS类包含以下属性:
display: inline-flex;
使得元素在垂直方向上居中。
align-items: center;
将子元素水平对齐到中心。
color: inherit;
继承父元素的文本颜色。
font-style: normal;
保持字体风格为正常。
line-height: 0;
使行高为0,实现文字的垂直居中。
text-align: center;
将文本对齐到中心。
text-transform: none;
不进行文本转换。
vertical-align: -0.125em;
使垂直文本对齐到距离顶部 -0.125个像素的位置。
text-rendering: optimizeLegibility;
优化渲染文本以提高可读性。
-webkit-font-smoothing: antialiased;
对于WebKit浏览器,增加抗锯齿效果。
-moz-osx-font-smoothing: grayscale;
对于Firefox OS X系统,使用灰度滤镜以减少模糊。
其他属性包括:
.anticon > * { line-height: 1; }
确保子元素的行高为1,使其与其父元素保持一致。
.anticon svg { display: inline-block; }
显示SVG元素作为块级元素。
.anticon::before { display: none; }
禁用自定义前缀的显示。
.anticon .anticon-icon { display: block; }
显示图标为块级元素。
.anticon[tabindex] { cursor: pointer; }
给.anticon
类的任何元素设置焦点。
.anticon-spin::before,
这个伪元素表示一个旋转图标,当鼠标悬停在图标上时显示,表明图标正在旋转。