• 코드:
​x
 
1
<!DOCTYPE html>
2
<html lang="ko">
3
​
4
<head>
5
    <meta charset="UTF-8">
6
    <title>CSS Position</title>
7
    <style>
8
        div.fixed {
9
            border: 2px solid #B8860B;
10
            width: 450px;
11
            position: fixed;
12
            top: 0;
13
            right: 0;
14
        }
15
    </style>
16
</head>
17
​
18
<body>
19
​
20
    <h1>고정 위치(fixed position) 지정 방식</h1>
21
    <div class="fixed">이 요소는 고정 위치 지정 방식으로 위치를 설정하였습니다.</div>
22
    <h2>제목 1</h2>
23
    <p>첫 번째 단락</p>
24
​
25
    <h2>제목 2</h2>
26
    <p>두 번째 단락</p>
27
​
28
    <h2>제목 3</h2>
29
    <p>세 번째 단락</p>
30
​
31
    <h2>제목 4</h2>
32
    <p>네 번째 단락</p>
33
​
34
    <h2>제목 5</h2>
35
    <p>다섯 번째 단락</p>
36
​
37
    <h2>제목 6</h2>
38
    <p>여섯 번째 단락</p>
39
​
40
    <h2>제목 7</h2>
41
    <p>일곱 번째 단락</p>
42
​
43
    <h2>제목 8</h2>
44
    <p>여덟 번째 단락</p>
45
​
46
    <h2>제목 9</h2>
47
    <p>아홉 번째 단락</p>
48
​
49
    <h2>제목 10</h2>
50
    <p>열 번째 단락</p>
51
​
52
    <h2>제목 11</h2>
53
    <p>열한 번째 단락</p>
54
​
55
    <h2>제목 12</h2>
56
    <p>열두 번째 단락</p>
57
​
58
    <h2>제목 13</h2>
59
    <p>열세 번째 단락</p>
60
​
61
</body>
62
​
63
</html>