border-radius

border-radius

 - border-radius : 요소의 모서리를 둥글게 깎음

•  0  : 둥글게 없음 
• 단위 : px em vw 단위로 지정 

 

 

코드펜 예시 

 

See the Pen border-radius by 김선미 (@tjsalsun) on CodePen.

• 각각의 모서리에 정 원를 생성해서 그 원의 반지름이 10px 되도록 배치한다. 배치된 만큼의 둥근 부분을 전부다 삭제해 버리는 것
• 특정한 모서리만 깎길 원한다면 border-radius : 0 10px 10px 0 (시계방향으로 적용된다)

---

TIL

key point

border-radius 반지름 기억하자

 

오늘의 학습 만족도 
⭐⭐⭐⭐⭐