CSS 선택자로는 세 가지가 있습니다. 세 선택자를 사용해 각각의 태그에 CSS 속성을 적용해봅시다!
1. Type 선택자 – 특정 태그에 스타일을 적용합니다.
<head>
<style> h1 { color: blue ; } </style>
</head>
<body>
<h1>Type Elice</h1>
</body>
2. Class 선택자 – .으로 클래스 이름을 선언하고, 해당 클래스에 스타일을 적용합니다.
<head>
<style> .coding { color: blue; } </style>
</head>
<body>
<h1 class= "coding">Class Elice</h1>
</body>
3. ID 선택자 – #으로 ID를 선언하고, 해당 ID에 스타일을 적용합니다.
<head>
<style> #coding { color: blue; } </style>
</head>
<body>
<h1 id= "coding">ID Elice</h1>
</body>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS 선택자</title>
<style>
h2 {color: red;}
</style>
<style>
.coding{color:green;}
</style>
<style>
#coding{color:yellow;}
</style>
</head>
<body>
<h2> Type Hello World</h2>
<h2 class="coding">Class Hello World</h2>
<h2 id="coding">Id Hello World</h2>
</body>
</html>
'온라인 강의 > CSS' 카테고리의 다른 글
| CSS 주요 속성 2 (0) | 2023.04.13 |
|---|---|
| CSS 주요 속성 1 (0) | 2023.04.13 |
| CSS속성의 상속 (0) | 2023.04.13 |
| CSS 연동 방법 (0) | 2023.04.13 |