소스코드
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./navercss.css">
</head>
<body>
<header>
<div class="search">
<div class="logo">
LOGO
</div>
<div class="bar">
SEARCH
</div>
</div>
<nav class="clearfix">
<ul>
<li>MAIL</li>
<li>CAFE</li>
<li>BLOG</li>
<li>IN</li>
<li>SHOPPING</li>
<li>PAY</li>
<li>TV</li>
<li>DICTIONARY</li>
<li>NEWS</li>
<li>WEBTOON</li>
</ul>
</nav>
</header>
<main>
<div>
</div>
<aside>
</aside>
</main>
</body>
</html>
css
header{
background: tomato;
margin:10px;
}
.search{
width:850px;
background: yellowgreen;
padding: 30px 0;
margin: auto;
display: flex;
}
.logo{
background: peru;
width:10%;
height:52px;
margin-top:2px;
}
.bar{
background: pink;
width: 90%;
height:60px;
}
nav{
background: powderblue;
}
nav li{
float:left;
margin-right: 10px;
list-style: none;
padding: 20px;
}
.clearfix::after {
content: "";
display: block;
clear: both;
}'Web' 카테고리의 다른 글
| 웹 서버 구축(백엔드)에대한 정의 (0) | 2021.03.08 |
|---|---|
| npm start시 발생 오류:code: 'MODULE_NOT_FOUND' (0) | 2021.02.06 |
| Junit 테스트코드 메소드 (0) | 2021.02.03 |
| Junit5에서의 @Before (0) | 2021.02.02 |
| java.sql.SQLSyntaxErrorException: Unknown column ' OOO ' in 'field list' 오류 (0) | 2021.01.23 |