File name
Commit message
Commit date
File name
Commit message
Commit date
<!DOCTYPE html>
<html lang="en">
<!-- 헤더 -->
<body>
<div class="header">
<div class="header-area flex justify-between align-center">
<div class="logo"></div>
<nav>
<ul>
<li>
<a href="#">About Us</a>
</li>
<li><a href="../../views/pages/Solution.html">Solution</a></li>
<li>
<a href="#">Portfolio</a>
<ul class="dropdown ">
<li><a href="#">Data</a></li>
<li><a href="#">Visualization</a></li>
<li><a href="#">Smart City</a></li>
<li><a href="#">Data Analysis</a></li>
<li><a href="#">Customized Consulting</a></li>
<li><a href="#">ETC</a></li>
</ul>
</li>
<li><a href="#">Marketing</a></li>
</ul>
</nav>
</div>
</div>
</body>
<style>
#header {
background-color: transparent;
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.logo {
background: url(../../resources/img/component/logo-w.png) no-repeat;
width: 200px;
background-size: contain;
height: 25px;
}
.header-area {
width: 100%;
margin: 0 auto;
padding: 10px 30px 7px 30px;
}
nav ul li {
width: 200px;
display: inline-block;
position: relative;
}
nav ul li a {
color: white;
font-size: 1.5rem;
display: block;
padding: 8px;
text-align: center;
}
nav ul li ul.dropdown {
display: none;
position: absolute;
top: 35px;
right: 0;
width: 100%;
margin: 0 auto;
text-align: center;
/* height: 100px; */
background-color: #f9f9f943;
transition: 0.3rem ease;
z-index: 1;
}
nav ul li:hover ul.dropdown {
display: block;
}
nav ul li ul.dropdown li a {
display: block;
color: #ffffff;
text-decoration: none;
}
</style>
</html>