프런트엔드-CSS

CSS 스타일링

강사: 최퍼블리셔 · 작성자: 이종춘 · 작성일: 2026-03-31 19:13:25 · 조회수: 19

스타일시트 홈페이지 헤더 설명
목록으로
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

a{
text-decoration: none;
color: black;
}

.header{
height: 80px;
border-bottom: 1px solid #808080;
padding: 0 250px;
}

.logo{
font-size: 28px;
font-weight: 900;
float: left;
line-height: 80px;
}

.menu_wrap{
float: right;
}

.menu{
font-size: 18px;
font-weight: 900;
float: left;
line-height: 80px;
margin-left: 100px;
}


</style>
</head>
<body>

<div class="header">

<div class="logo">
<a href="#">LOGO</a>
</div>

<div class="menu_wrap">
<div class="menu"><a href="#">Home</a></div>
<div class="menu"><a href="#">Product</a></div>
<div class="menu"><a href="#">Event</a></div>
<div class="menu"><a href="#">Info</a></div>
</div>

</div>


</body>
</html>
#스타일시트 홈페이지 헤더

첨부 파일

0개
첨부된 파일이 없습니다.

댓글 / 답글

0개
댓글을 작성하려면 로그인하세요.
아직 댓글이 없습니다.