복습 챌린지 #1

Coddy HTML 여정의 Styling with CSS 섹션에 포함된 레슨 — 76개 중 29번째.

챌린지

쉬움

CSS를 사용하여 텍스트와 배경 스타일을 지정하는 다양한 기술을 마스터했으므로, 이제 종합적인 챌린지를 통해 지식을 테스트할 시간입니다. 색상, 헥사 코드, RGB 값 및 RGBA를 사용한 투명도에 대해 배운 내용을 적용하여 특정 디자인을 만들어 보세요.

제목(<h1>), 단락(<p>), 그리고 구분(<div>)이 포함된 HTML 문서가 제공됩니다. 여러분의 과제는 배운 텍스트 및 배경 스타일 속성을 사용하여 아래 이미지에 표시된 디자인과 일치하도록 이러한 요소를 스타일링하는 것입니다.

아래 단계를 따르세요:

<h1> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 white로, background-color를 #000080 (네이비 블루)으로, text-align을 center로 설정하세요.
<p> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 #FFFFFF (화이트)로, background-color를 rgba(0, 0, 0, 0.5) (반투명 블랙)로, font-size를 18px로 설정하세요.
<div> 요소를 대상으로 하는 CSS 규칙을 작성하세요. background-color를 rgba(237, 170, 26, 1) (골든 옐로우)로, color를 white로 설정하세요.

직접 해보기

<html>
<head>
    <title>Recap Challenge #1</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>