Python_WEB/HTML
HTML5 - 190622 Basic Study 53(고정형 네비게이션 바)
AnKiWoong
2019. 6. 22. 18:35
반응형
1. HTML Code
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>고정형 네비게이션 바</title>
<link href="css/ex09.css" rel="stylesheet">
</head>
<body>
<h1>고정형 네비게이션 바</h1>
<section>section1</section>
<section>section2</section>
<section>section3</section>
</body>
</html>
2. CSS Code
@charset "utf-8";
/* CSS Document */
*{
margin:0 auto;
padding:0;
}
ul, li{
list-style:none;
}
html, body{
width:100%;
height:100%;
}
section{
width:100%;
height:100%;
}
section:nth-of-type(1){
background:gold;
}
section:nth-of-type(2){
background:silver;
}
section:nth-of-type(3){
background:pink;
}
h1{
position:fixed;
background:black;
color:white;
left:0;
top:0;
right:0;
}
3. HTML / CSS 파일
반응형