미해결
반응형 웹사이트 포트폴리오(App Official Landing Website)
header부분 오류때문에 질문 드립니다 분명 제가 한것에다가 코드도 복사해서 붙여넣었는데도 이상해요
hhtml과 css 첨부해서 적습니다
<!DOCTYPE html>
<head>
<meta charset="UTP-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>StarUp Mate : App Offical Landing</title>
<link rel="icon" href="images/logo-favicon.png">
<!-- jQuery CDN-->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!--Slick Slider-->
<link rel="stylesheet" href="../js/slick/slick-theme.css">
<link rel="stylesheet" href="../js/slick/slick.css">
<script src="../js/slick/slick.min.js"></script>
<!--Custom CSS & JS-->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">
<script src="script/custom.js"></script>
</head>
<body>
<!--Header-->
<header>
<div class="header-inner">
<div class="logo">
<a href="#"><img src="images/logo.png" alt=""></a>
<div class="gnb">
<a href="#none">CEO 인사말</a>
<a href="#none">서비스 특징</a>
<a href="#none"> 자주 묻는 질문들</a>
<a href="#none">경영비전</a>
<a href="#none"> 사용자 리뷰</a>
<a href="#none"> 앱 사용자 가이드</a>
<a href="#none">최신소식</a>
</div>
</div>
</div>
</header>
<!--welcome-->
<section class="welcome">
<div class="slideshow">
<img src="images/slide-welcome-01.png">
<img src="images/slide-welcome-02.png">
<img src="images/slide-welcome-03.png">
</div>
<div class="welcome-heading">
<span>창의적인 아이디어를 만드는 가장 빠른 방법</span>
<h1>
An idea solution of startup for your
</h1>
<em>
Business strategy
Organization Management
Business Innovation
</em>
<p>
스타트업 메이트 앱이 여러분의 최상의 스타트업 구축을
위해 창의적인 아이디어를 제공하는 데 최선을 다하겠습니다.
</p>
</div>
</section>
<!--ceo-access-->
<section class="ceo-access">
<div class="ceo-inner">
<div class="ceo-inner">
<div class="ceo-content">
<div class="ceo-left">
<img src="images/quotation-mark.svg" alt="">
<h3>3 Pre-made Solutions for your Startup Business</h3>
<p>창의적인 아이디어를 가장 빠르게 창출할 수 있는 최고의 앱 솔루션을 제공합니다.
여러분의 스타트업을 더욱 성장시키기 위해 온 힘을 다할 것이며
STARTUP MATE 라는 이름답게 항상 동반자가 되겠습니다. 감사합니다.</p>
<span>앤드류 - 스타트업 메이트 대표이사</span>
</div>
<div class="ceo-right">
<div class="ceo-msg">
<h3>Application Downloads<big>30,000+</big></h3>
<p>스타트업메이트는 앱 다운로드 30,000명 이상의 앱 사용자의 충분한 피드백을 통해 검증된 서비스를 제공합니다.</p>
</div>
<div class="ceo-photo">
<img src="images/icon-face-ceo.jpg" alt="">
</div>
</div>
</div>
</div>
</div>
<div class="access-inner">
<div class="access-content">
<div class="access-left">
<h2>언제나 어디서나 즐겁고 편리한 액세스 스타트업 CEO들의 커뮤니티</h2>
<p>언제나 어디서나. 즐겁고 편리한 액세스가 가능합니다.
회원 가입은 쉽고 간단합니다.
무료 회원 가입 후 로그인하시면 업데이트 된 스타트업 메이트의 서비스를 받으실 수 있습니다.</p>
<div class="btn-download">
<a href=""><img src="images/btn-appstore.png" alt=""></a>
<a href=""><img src="images/btn-playstore.png" alt=""></a>
</div>
</div>
</div>
<div class="access-right">
<img src="images/access-mockup.png" alt="">
</div>
</div>
</section>
css
/* Fontawesome 4.7 */
@import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
/* XEION CDN */
@import url('http://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css');
/* Web Fonts - Source Sans Pro */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap');
/* font-family: 'Source Sans Pro', sans-serif; */
/* Web Fonts - NoonNoo */
@font-face {
font-family: 'NEXON Lv2 Gothic';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Reset CSS */
* {
box-sizing: border-box;
}
a {
text-decoration: none;
color: #222;
}
button, input {
outline: none;
}
h1,h2,h3,h4,h5,h6 {
margin-top: 0;
font-weight: normal;
line-height: 1.5em;
}
/* Default CSS */
body {
font-family: 'NEXON Lv2 Gothic', sans-serif;
font-size: 18px;
line-height: 1.7em;
margin: 0;
background-color: #fff;
color: #222;
}
/* header */
.header {}
.header-inner{
border: 1px solid #000;
width: 1300px;
margin: auto;
overflow: hidden;
padding-top: 30px;
padding-bottom: 15px;
}
.logo {
float: left;
}
.logo img{
margin-top:-7px;
}
.gnb {
float: right;
}
.gnb a{
margin: 10px;
font-size: 16px;
}