HTML，CSS，Javascript在彼此之間創建圈子

Question

我需要使用HTML，CSS和Javascript在彼此之間創建圓圈，並且可以點擊按鈕，這將自動添加另一個圓圈。 新添加的圈子將是最外圈子。

有關如何做到這一點的任何想法？

Answer 1

對於圓圈，您需要將border-radius設置為足夠大的值（通常，寬度和高度的最大值的一半以上）。

要添加更大的圓圈，您需要復制以前的圓圈，創建另一個圓圈，更大的圓圈，並將復制的圓圈粘貼到其中。 這是一個jQuery片段，但您可以使用任何框架，甚至是普通的js：

var $container = $('#container'),
    $previous_circles = $container.html()

$container
  .html('<div class="circle bigger_circle"></div>')
  .find('.bigger_circle')
  .append($previous_circles)
  .end()