전체 선택자

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

전체 선택자는 페이지의 모든 HTML 요소를 대상으로 하는 CSS의 강력한 선택자입니다. 이는 별표(*)로 표시됩니다.

전체 선택자를 사용하면 유형, 클래스 또는 ID에 관계없이 모든 요소에 지정된 스타일이 적용됩니다. 이는 문서 전체에서 전역 스타일을 설정하거나 기본 스타일을 초기화하는 데 유용할 수 있습니다.

전체 선택자를 사용하기 위한 기본 구문은 다음과 같습니다:

* {
    property: value;
}

예를 들어, 페이지의 모든 요소에 대해 기본 텍스트 색상과 글꼴 크기를 설정하고 싶다고 가정해 보겠습니다. 다음과 같이 전체 선택자(universal selector)를 사용할 수 있습니다:

* {
    color: black;
    font-size: 14px;
}

챌린지

쉬움

다양한 요소(제목 <h1>, <h2>, 단락 <p>, 그리고 디비전 <div>)가 포함된 HTML 문서가 주어집니다. 여러분의 작업은 전체 선택자(universal selector)를 사용하여 이러한 요소들의 스타일을 지정하는 것입니다. 다음 단계를 따르세요:

모든 요소의 텍스트 색상을 "darkgray"로, 글꼴 크기를 "16px"로 설정하는 전체 선택자를 사용한 CSS 규칙을 작성하세요.

치트 시트

전체 선택자(universal selector)는 별표(*)를 사용하여 페이지의 모든 HTML 요소를 선택합니다:

* {
    property: value;
}

전역 텍스트 색상과 글꼴 크기를 설정하는 예시:

* {
    color: black;
    font-size: 14px;
}

직접 해보기

<html>
<head>
    <title>Universal Selector</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a main heading</h1>
    <h2>This is a subheading</h2>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>