⭐css 선택자는
html 문서에서
스타일을 적용하고 싶은 특정 요소를 선택하는 도구다.
css로 html 문서를 렌더링하려면 각 부분을 선택할 수 있어야 한다.
선택자는 html에 "이 요소에 스타일을 입히고 싶어요"라고 알려준다.
👍css선택자는 웹 페이지의 디자인과 레이아웃을 제어하는 첫 단계라고 할 수 있다.
✨ 기본선택자 https://notion6780.tistory.com/97
✨ 결합선택자 https://notion6780.tistory.com/98
✨ 가상클래스 선택자 https://notion6780.tistory.com/99
✨ 속성선택자 등이 있다. https://notion6780.tistory.com/100
문법
a { background-color: yellow; }
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>css selector 선택자 연습</title>
<!-- 내부 스타일 시트-->
<style>
/* tag 선택자 */
p {
color: blue;
}
/* id 선택자 */
#id1 {
background-color: aquamarine;
}
#id2 {
background-color: antiquewhite;
}
/* class 선택자 */
.class1 {
font-size: 20px;
font-weight: 800;
color: blueviolet;
}
</style>
</head>
<body>
<h2>css 선택자란</h2>
<p id="id1">여기는 1번 p태그</p>
<p id="id2">여기는 2번 p태그</p>
<p class="class1">여기는 3번 p태그</p>
<p class="class1">여기는 4번 p태그</p>
</body>
'HTML CSS' 카테고리의 다른 글
| html/css) css선택자 - 기본선택자 (0) | 2025.05.29 |
|---|---|
| html/css) css에서 사용하는 주요 단위 (0) | 2025.05.28 |
| html/css) 시멘틱 태그 semantic tag (0) | 2025.05.28 |
| html/css) table 태그로 표 만들기 (0) | 2025.05.28 |
| html/css) 속성 Attribute 활용 (0) | 2025.05.28 |
