<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>수평 내비게이션 만들기 </title>
<style>
* {box-sizing:border-box;} /* 모든 요소에 테두리까지 포함한 너빗값 지정 */
nav ul {list-style:none;} /* 불릿이나 숫자 번호 없앰*/
nav ul li{
display:inline-block; /*인라인 레벨 요소와 블록 레벨 요소 모두 지정 */
padding:20px; /*패딩값 20px */
margin:0 20px; /*마진값 20px */
border:1px solid #222; /*메뉴에 테두리 지정 */
}
</style>
</head>
<body>
<nav>
<ul>
<li>menu 1</li>
<li>menu 2</li>
<li>menu 3</li>
<li>menu 4</li>
</ul>
</nav>
</body>
</html>
결과: 수평 내비게이션 만들기