-
Notifications
You must be signed in to change notification settings - Fork 44
/
Copy pathsample174_07.html
78 lines (66 loc) · 2.33 KB
/
sample174_07.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Layout07</title>
<style>
/* 리셋 */
* {margin: 0; padding: 0;}
/* 전체 레이아웃 */
#wrap {font-size: 20px; color: #fff; text-align: center;}
#header {height: 140px;}
#banner {height: 450px; line-height: 450px; background: #4dd0e1;}
#contents {height: 950px;}
#footer {height: 220px;}
/* 레이아웃 */
#header-top {height: 70px; line-height: 70px; background: #b2ebf2;}
#header-nav {height: 70px; line-height: 70px; background: #80deea;}
#content1 {height: 90px; line-height: 90px; background-color: #26c6da;}
#content2 {height: 480px; line-height: 480px; background-color: #00bcd4;}
#content3 {height: 380px; line-height: 380px; background-color: #00acc1;}
#footer-nav {height: 60px; line-height: 60px; background-color: #0097a7;}
#footer-info {height: 160px; line-height: 160px; background-color: #00838f;}
/* 컨테이너 */
.container {width: 1100px; margin: 0 auto; height: inherit; background: rgba(255,255,255,0.3);}
</style>
</head>
<body>
<div id="wrap">
<div id="header">
<div id="header-top">
<div class="container">header-top</div>
</div>
<div id="header-nav">
<div class="container">header-nav</div>
</div>
</div>
<!-- //header -->
<div id="banner">
<div class="container">banner</div>
</div>
<!-- //banner -->
<div id="contents">
<div id="content1">
<div class="container">content1</div>
</div>
<div id="content2">
<div class="container">content2</div>
</div>
<div id="content3">
<div class="container">content3</div>
</div>
</div>
<!-- //contents -->
<div id="footer">
<div id="footer-nav">
<div class="container">footer-nav</div>
</div>
<div id="footer-info">
<div class="container">footer-info</div>
</div>
</div>
<!-- //footer -->
</div>
<!-- //wrap -->
</body>
</html>