복습 챌린지 #2

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

챌린지

쉬움

이 두 번째 요약 챌린지에서는 CSS의 텍스트 스타일링 속성에 대한 지식을 적용하여 특정 디자인을 재현해 봅니다. 이 챌린지는 주어진 디자인에 맞추기 위해 color, font-family, font-size, font-weight, text-align, 그리고 text-decoration과 같은 다양한 텍스트 속성을 결합하는 능력을 테스트합니다.

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

아래 단계를 따르세요:

<h1> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 black으로, font-family를 "Times New Roman", Times, serif로, font-size를 48px로, font-weight를 bold로, 그리고 text-align을 center로 설정하세요.
<p> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 gray로, font-family를 Arial, Helvetica, sans-serif로, font-size를 18px로, 그리고 text-align을 center로 설정하세요.
<a> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 red로, text-decoration을 none으로 설정하세요.
모든 <li> 요소를 대상으로 하는 CSS 규칙을 작성하세요. color를 green으로, font-family를 "Courier New", Courier, monospace로, font-size를 25px로, 그리고 font-weight를 600으로 설정하세요.

직접 해보기

<html>
<head>
    <title>Recap Challenge #2</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph with a <a href="#">link</a>.</p>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</body>
</html>