[英]How do I make circles within a larger circle, and text within the center of all the circles, in CSS?
你可以用這樣的東西
的CSS
.outer_circle {
height:400px;
line-height:400px;
width:400px;
border-radius:50%;
background-color:#000000;
position:relative;
margin:0 auto;
}
.outer_circle p {
text-align:center;
vertical-align:middle;
color:#ffffff;
}
.circle {
background-color:#aeaeae;
border-radius:50%;
height:40px;
line-height:20px;
width:40px;
position:absolute;
margin:10px;
}
.circle p {
font-size:10px;
vertical-align:middle;
color:#000000;
}
html
<div class="outer_circle" >
<div class="circle" style="top:10px;left:150px"><p>Text</p></div>
<div class="circle" style="top:70px;left:260px"><p>Text</p></div>
<div class="circle" style="top:150px;left:320px"><p>Text</p></div>
<div class="circle" style="top:250px;left:260px"><p>Text</p></div>
<div class="circle" style="bottom:70px;left:150px"><p>Text </p></div>
<p> Text Text Text Text Text Text Text Text </p>
根據需要調整高度,寬度等。 希望這可以幫助
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.