1. 셀렉터 (Selector, 선택자)
스타일을 먹일 HTML 요소들을 선택하기 위해 CSS에서 제공하는 방법. 제목을 빨간색으로 바꾸려면 먼저 제목을 선택해야된다.
p {
color: red;
}
1
2
3
2
3
여기서 p를 selector라고 한다.
2. 프로퍼티 (Property, 속성)
p {
color: red;
}
1
2
3
2
3
여기서 color를 property라고 한다.
3. 값 (Value, 속성값)
p {
color: red;
}
1
2
3
2
3
여기서 red를 value라고 한다.
4. HTML에 적용하는 여러가지 방법
4-1. Link
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<p>Contents of page</p>
</body>
</html>
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
4-2. Embedding
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red;
}
</style>
</head>
<body>
<p>Contents of page</p>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
4-3. Inline
<!DOCTYPE html>
<html>
<body>
<p style="color: red">Contents of page</p>
</body>
</html>
1
2
3
4
5
6
2
3
4
5
6