只需要一个中心圆

Question

我只想要一个圆圈在中心而不是围绕它的圆圈。我不想更改当前代码（渐变样式）。我怎样才能实现它？

 
 #bar {
  position: relative;
  height: 200px;
  width: 600px;
  background: linear-gradient(to left, yellow 99.9%, blue 99.9%), radial-gradient(circle at 50% 50%, yellow 50%, transparent 10%);
  background-position: 50% 100px, 50% 50%;  
  background-size:100% 15px, 100px 100px; 
  background-repeat: no-repeat, repeat-x;
}

<div id="bar"></div>

Answer 1

删除repeat-x

#bar {
  position: relative;
  height: 200px;
  width: 600px;
  background: linear-gradient(to left, yellow 99.9%, blue 99.9%), radial-gradient(circle at 50% 50%, yellow 50%, transparent 10%);
  background-position: 50% 100px, 50% 50%;  
  background-size:100% 15px, 100px 100px; 
  background-repeat: no-repeat;
}

<div id="bar"></div>

Answer 2

您应该删除repeat-x

 #bar {
  position: relative;
  height: 200px;
  width: 600px;
  background: #fff; //type in your color between # and ;
  background-position: 50% 100px, 50% 50%;  
  background-size:0 15px, 100px 100px; 
  background-repeat: no-repeat;
}