css如何设置圆圈颜色1/2

 我来答
a3476012
推荐于2018-03-11 · TA获得超过1269个赞
知道小有建树答主
回答量:484
采纳率:87%
帮助的人:141万
展开全部

这边的设置圆圈颜色,有点歧义.

    1.类似圆环的形式;2.半圆填充颜色

对于第一种那就简单了:

div{
 width: 200px;
 height:200px;
 border-radius: 50%;
 border: 10px solid #1AA1E1;

 display: inline-block;

 box-sizing: border-box;

}

第二种半圆的话,那么会相对麻烦点(当然图片的方法就不说了):

div{

  width: 200px;

  height:200px;

  border-radius: 50%;

  position: relative;

  display: inline-block;

  box-sizing: border-box;

  overflow: hidden;

  border:1px solid #e3e3e3;

}

div:after{

  content: '';

  position: absolute;

  width: 50%;

  height: 100%;

  background-color: #0000FF;

  top:0;

  left:0;

}


推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式