CSS - 기본 선택자
2019. 11. 24. 10:51ㆍ웹/CSS
선택자
HTML에 스타일(CSS)을 적용하기 위해 HTML의 특정한 요소를 선택하는 사인
전체 선택자(Universal Selector)
(요소 내부의) 모든 요소를 선택
<head>
<style>
* {
color : red;
}
</style>
</head>
<body>
<h1>제목</h1>
<p>본문</p>
</body>
태그 선택자(Type Selector)
태그 이름이 E인 요소 선택
<head>
<style>
h1 {
color : red;
}
p {
color : blue;
}
</style>
</head>
<body>
<h1>제목</h1>
<p>본문</p>
</body>
클래스 선택자(Class Selector)
HTML class 속성의 값이 E인 요소 선택
<head>
<style>
.title {
color: red;
}
.main-text {
color: blue;
}
</style>
</head>
<body>
<h1 class=“title”>제목1</h1>
<p class=“main-text”>본문</p>
</body>
아이디 선택자(ID Selector)
HTML id 속성의 값이 E인 요소 선택
<head>
<style>
#title {
color: red;
}
</style>
</head>
<body>
<h1 id=“title”>제목1</h1>
<p>본문</p>
</body>
출처 : heropy.org
'웹 > CSS' 카테고리의 다른 글
| CSS - 가상클래스 선택자 - first-child, last-child, nth-child (0) | 2019.12.11 |
|---|---|
| CSS - 가상클래스 선택자(Pseudo-Classes Selectors) - hover, active, focus (0) | 2019.12.11 |
| CSS - 복합 선택자(Combinator) (0) | 2019.12.11 |
| CSS - 블럭 / 인라인 (0) | 2019.11.24 |
| CSS - 선언 방식 (0) | 2019.11.24 |