🎨 코딩 첫걸음

CSS 꾸미기 실험실

HTML이 뼈대라면 CSS는 옷이에요 — 버튼을 누르면 코드와 화면이 함께 바뀌어요

글자에 옷을 입혀 봐요

아래 버튼을 누르면 속성: 값 한 줄이 코드에 생겨요. CSS는 무엇을 어떻게 꾸밀지 적는 언어예요!

color 글자색

background-color 배경색

font-size 글자 크기

font-weight · text-align 굵기와 정렬

📄 코드 (CSS)

🖥️ 화면

안녕! 나는 CSS로 꾸며진 글이야

박스의 세 겹을 만져 봐요

모든 요소는 상자예요. 안쪽 여백(padding) · 테두리(border) · 바깥 여백(margin)이 겹겹이 감싸고 있죠!

나는 상자예요
margin border padding

📄 코드 (CSS)

목표와 똑같이 꾸며 봐요

위쪽 목표와 아래쪽 내 작품이 똑같아지도록 버튼을 골라 보세요. 몇 가지가 다른지 알려줄게요!

🎯 목표

✏️ 내 작품

color

background-color

font-size

font-weight · text-align

📄 내 코드 (CSS)