카테고리 없음

html circle / 여러 개 나란히 정렬

닉네임이 멋이 중헌디 2021. 3. 28. 19:07

html circle

<svg height="210" width="500">
     <circle cx="100" cy="100" r="50" style="fill:lime;stroke:purple;stroke-width:3" /> 
</svg>

 

-svg height, width로 circle의 영역이 되는 네모를 잡는다 

-그 안에서 cx, cy로 x,y를 정하고 r이 반지름. 

네모의 왼, 위 모서리가 (0,0)가 된다. 

-style는 id값 줘서 css파일에서 {fill:lime;stroke:purple;stroke-width:3}로 써도 된다. 

 

 

여러개 나란히 정렬

<div id="parent">

  <div class = "one"></div>

  <div class = "two"></div>

  <div class = "three"></div>

</div>

 

#parent{

display: flex;

}

.child{

flex:1;

}