Coding Campus

Level 4 CSS로 화면 꾸미기 예상 시간 12분 진행 전

로그인하면 완료 기록이 저장돼요.

1. 오늘 배울 내용

  • CSS는 웹페이지의 색과 모양을 꾸미는 언어예요.
  • margin은 바깥 여백, padding은 안쪽 여백이에요.

2. 따라 하기

1

버튼 색을 바꿔보세요.

2

카드 안쪽 여백을 넓혀보세요.

3

글자 크기를 조절해보세요.

3. 직접 해보기

내가 좋아하는 색으로 카드 스타일을 만들어보세요.

코드 예제 css 
.card {
  padding: 20px;
  margin: 12px;
  background: #eef6ff;
  border-radius: 16px;
}
.button {
  color: white;
  background: #2563eb;
}
코드 실행기 영역 이번 버전에서는 예제를 보고 따라 쓰는 영역만 제공합니다. 실행기는 다음 단계에서 연결할 수 있어요.

4. 확인 문제

1. 안쪽 여백을 만드는 CSS 속성은 ____ 입니다.

정답 확인하기는 확인 문제 채점만 합니다. 미션 완료는 아래 단계에서 진행해요.

5. 완료 체크

확인 문제를 통과한 뒤, 아래 항목을 모두 체크하면 미션을 완료할 수 있어요.

확인 문제를 통과하고 완료 체크를 모두 선택하면 완료할 수 있어요.