如何通過css/js將N個圓圈分佈到另一個圓的內部邊界？

Question

我需要一個代碼，允許我在另一個圓圈內插入任意數量的os圓圈，保持小圓圈均勻分佈。

使用border-radius: 50%; 創建圈子紅圈內會有文字。是的我知道。這很複雜。

預期的組織可能是以下幾點：

Answer 1

由於某種原因，我不能在這裏插入片段，所以http://jsfiddle.net/vr60dLth/

HTML

<div class='back'></div> 

CSS

jQuery的

var N = 8, pi = Math.PI, backR = 100, frontR = 15, radius = 70; 

$('.back').width(backR * 2).height(backR * 2); 

for(var angle = 0; angle < 2 * pi; angle += 2 * pi/N) 
{ 
    var s = $('<div class="front">').css({ 
     left: backR - frontR + radius * Math.cos(angle) + 'px', 
     top: backR - frontR + radius * Math.sin(angle) + 'px', 
     width: frontR * 2 + 'px', 
     height: frontR * 2 + 'px' 
    }); 
    $('.back').append(s); 
}