반응형
전체선택자(Universal selector) 란?
CSS에서 전체 선택자 란, CSS 스타일 문서에서 적용한 스타일이 모든 요소에 적용됨을 의미합니다.
전체선택자는 하기 문번 규칙을 가집니다.
* { 속성 : 값; }
실제 예제로 전체선택자를 알아보겠습니다.
main.css 파일을 만들고 컬러 와 폰트 굵기를 나타내는 속성 과 값을 지정 합니다.
/* 전체 선택자 */
* {
color: blue;
font-weight: bold;
}index.html
하기 html 파일 예제 에서 link 방식으로 css 파일을 연결하고 있습니다.
내부 스타일 시트 방식으로 스타일을 코딩해도 됩니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>전체선택자</title>
<link rel="stylesheet" href="/CSS/main.css">
</head>
<body>
<h1>Hello, World!</h1>
<p>This is an example paragraph.</p>
<div>
<p>This is another paragraph.</p>
</div>
</body>
</html>웹페이지를 실행 시켜보면, 해당 css 파일의 영향을 받은 모든 요소들이 파란색과 bold 체로 바뀌게 됩니다.
오늘은 CSS의 기본선택자 중 첫번째 전체선택자 에 대해서 알아보았습니다.
전체선택자는 * 로 나타낸 다는 것, 모든 요소에 적용된다는 것 두가지가 포인트가 되겠습니다.
감사합니다.
반응형
'앱 만들기 > CSS study' 카테고리의 다른 글
| CSS 클래스 선택자 란? (5) | 2023.06.03 |
|---|---|
| CSS 타입 선택자(Type selector) 란? (2) | 2023.06.02 |
| 브라우저 스타일 초기화 하는 방법 (2) | 2023.05.30 |
| CSS 주요 font 속성 4가지 알아보기 (0) | 2023.05.12 |
| 브라우저 기본 스타일 이란? (0) | 2023.05.10 |
댓글