<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="il.css" />
<!-- <link
rel="stylesheet"
/> -->
<style>
</style>
</head>
<body>
<div class="font">안녕</div>
<nav>
<ul>
<li>메뉴1</li>
<li>메뉴2</li>
<li>메뉴3</li>
<li>메뉴4</li>
</ul>
</nav>
<div class="back"></div>
</body>
</html>
nav ul {
list-style: none;
}
/* 점을 없애준다! */
nav ul li {
display: inline-block;
padding: 20px;
/* margin-left: -6px; */
border: 1px solid red;
background-color: rgb(255, 82, 82);
opacity: 0.5;
/* 채도가 연해져썽! */
}
* {
font-family: "Nanum Pen Script", cursive;
font-weight: bold;
text-align: center;
}
.back {
width: 500px;
height: 300px;
background-color: aquamarine;
background-image: url(/2023-09-27/img/그림4.png);
background-repeat: repeat-x;
/* 가로로 반복해서 나오는거 */
/* background-size: ; */
background-position: 100px;
/* 100px만큼 떨어진다. */
}
'프론트엔드 > HTML' 카테고리의 다른 글
| 실습 홈페이지도 만들어보기 (0) | 2023.10.18 |
|---|---|
| 박스 순서도 (0) | 2023.10.18 |
| 글꼴 지정 (0) | 2023.10.18 |
| display? 그냥 연습해본 거. (0) | 2023.10.18 |
| display? 그냥 연습해본 거. (0) | 2023.10.18 |