매일 CSS 챌린지

프론트 개발자로서 나한테 부족한 부분을 어떻게 채울까 고민하다가 시작하게 되었다. 사실 첫 번째 챌린지부터 너무 어려워서 시작할까 말까 고민만 일주일 한건 비밀.

CHALLENGE 1

첫번째 챌린지는 100 DAYS CSS CHALLENGE 로고를 만드는 것이었다. 처음에 100이 그냥 단순 텍스트인줄 알고 폰트 설정하고 자간만 맞추면 될 줄 알았는데, 알고보니 div 덩어리들이었다.

배운 점

  • background: linear-gradient(direction, from color, to color) : 백그라운드 색상을 gradient로 설정할 수 있다.
  • transform: translate(x, y), rotate(deg) 요소를 이동하고 회전시킬 수 있다.
  • box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2) : offset-x offset-y blur-radius color : 박스 그림자를 생성한다.
  • border-radius: deg; : 요소의 모서리의 곡률. 50%인 경우 원을 만든다!

결과물