Question

我正在尝试使用Bootstrap glyph icons作为带圆圈背景的按钮。我想用css达到这个目的。我发现了两种可能性（下面），但它在IE9兼容模式下不起作用。什么是棘手的，并导致IE问题？

li:nth-child(even) .button-16 {
  background-color: #369;
  border: 2px solid #369;
  border-radius: 16px;
}  
li:nth-child(odd) .button-16:after {
  content: " ";
  display: block;
  height: 16px;
  z-index: -1;
  position: relative;
  background-color: #369;
  border-radius: 16px;
  box-shadow: 0px 0px 1px 0px #369;
  width: 16px;
  left: -1px;
  top: -1px;
}

这是有效的example

电贺！

Answer 1

IE9兼容模式意味着该网站与较旧的IE版本兼容，但不幸的是不支持border-radius。

像Css3pie一样，有一些黑客可以解决这个问题。

更新： IE中也不支持伪类:nth-child＆lt; 9。这里有示例网站，您可以在其中查看主要浏览器http://reference.sitepoint.com/css/selectorref

中css的支持方式

Bootstrap标志符号图标与仅由CSS的圆圈背景

1 个答案: