Question

我有以下标记：

<ul>
  <li><a href="#1"></a></li>
  <li><a href="#2"></a></li>
  <li><a href="#3"></a></li>
</ul>

是否可以使A标签成为圆周？

我知道如何使用border-radius ...

制作圈子

但是如何让他们成为一个圆周？

谢谢你，米格尔

Answer 1

你的意思是这样显示周长吗？

＆＃13;

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
li {
    width: 100px;
    height: 100px;
    border-radius: 100px;
    border: 5px solid #c00;
}

＆＃13;

<ul>
  <li><a href="#1"></a></li>
  <li><a href="#2"></a></li>
  <li><a href="#3"></a></li>
</ul>

＆＃13;

Answer 2

我不确定你的圆周是什么意思。但我想你可以将想要的周长除以4。

像这样：http://jsfiddle.net/QtE3G/

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
li {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    border: 5px solid #aaccdd;
}

这里的周长是200px。

如何用CSS创建圆周？

2 个答案: