인프런 커뮤니티 질문&답변
작성한 질문수
왜 전 선생님과 화면이 다를까요?
작성
·
285
1
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>StartUp</title>
<!-- Favicon Logo -->
<link rel="icon" href="image/logo-favicon.png">
<!-- -->
<!-- jQuery CDN -->
<script src="/script/jquery-3.4.1.min.js"></script>
<!-- -->
<!-- Slick Slider -->
<link rel="stylesheet" href="script/slick-theme.css">
<link rel="stylesheet" href="script/slick.css">
<script src="/script/slick.min.js"></script>
<!-- -->
<!-- LINK CSS & SCRIPT -->
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/respon.css">
<script src="/script/main.js"></script>
<!-- -->
<!-- Fontawesome lINK -->
<script src="https://kit.fontawesome.com/8e2986d4b4.js" crossorigin="anonymous"></script>
<!-- -->
</head>
<body>
<div class="container">
<!-- Header -->
<header>
<div class="header-inner">
<div class="logo">
<a href="#none"><img src="/image/logo.png" alt=""></a>
</div>
<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>
</header>
<!-- welcome -->
<section class="welcome">
<div class="slideshow">
<img src="/image/slide-welcome-01.png" alt="">
<img src="/image/slide-welcome-02.png" alt="">
<img src="/image/slide-welcome-03.png" alt="">
</div>
<div class="wecome-heading">
<span>창의적인 아이디어를 만드는 가장 빠른 방법</span>
<h1>An idea solution of startup for your<em>3가지 타이핑 텍스트 자리</em></h1>
<p>
스타트업 메이트 앱이 여러분의 최상의 스타트업 구축을 위해 창의적인 아이디어를 제공하는 데 최선을 다하겠습니다.
</p>
<div class="welcome-btns">
<a href="#none" class="btn start">CEO 시작하기</a>
<a href="#none" class="btn guide">사용자 가이드</a>
</div>
</div>
<div class="mouse">
<span class="wheel"></span>
</div>
</section>
<!-- ceo-access -->
<section class="ceo-access"></section>
<!-- banner -->
<section class="banner"></section>
<!-- feature -->
<section class="feature"></section>
<!-- vision -->
<section class="vision"></section>
<!-- faq -->
<section class="faq"></section>
<!-- review -->
<section class="review"></section>
<!-- focus -->
<section class="focus"></section>
<!-- guide -->
<section class="guide"></section>
<!-- news -->
<section class="news"></section>
<!-- footer -->
<footer></footer>
</div>
</body>
</html>
/* Font */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;1,400&display=swap');
/* font-family: 'Source Sans Pro', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@100;200;300;400;500;600&display=swap');
/* font-family: 'Gothic A1', sans-serif; */
/* */
/* Setting CSS */
/* 박스사이징 고정 */
*{
box-sizing: border-box;
}
/* A태그 색상 및 데코 none */
a{
text-decoration: none;
color:#222;
}
/* 버튼,인풋에 기본적으로 들어가있는 아웃라인 제거 */
button, input{
outline:none;
}
/* h태그들 제거, 마진 탑만 0, 라인하이트 설정 */
h1,h2,h3,h4,h5,h6{
margin-top: 0;
font-weight: normal;
line-height: 1.5em;
}
/* Default CSS */
/* 바디에 글꼴설정, a태그와 같은 글씨색상 */
body{
font-family: 'Gothic A1', sans-serif;
font-size: 18px;
line-height: 1.7em;
margin: 0;
background-color: white;
color:#222;
}
/* Header */
header{
}
.header-inner{
width: 1300px;
margin: auto;
overflow: hidden;
padding-top:30px;
padding-bottom:15px;
}
.logo{
float: left;
}
.logo img{
margin-top:-5px;
}
.gnb{
float: right;
}
.gnb a{
margin:10px;
font-size:16px;
}
/* Welome */
.welcome{
height: 90vh;
position: relative;
}
.welcome-heading{
position: absolute;
top: 50%;
transform:translateY(-50%);
left:200px;
border:5px solid red;
width: 750px;
text-align: center;
}
/* ceo-acess */
/* banner */
/* feature */
/* vision */
/* faq */
/* review */
/* focus */
/* guide */
/* news */
/* footer */
안녕하세요, 선생님보고 코드따라썼는데 자꾸 welcome-heading부분이 위로 안올라오고 아래로 자꾸 떨어지는데.. 왜그럴까요?
답변 3
0
신형화
질문자
네 어디가 오류인지모르겠지만... 다시 싹 지우고 마음을 비우고 처음부터 다시 하드코딩해봤떠니 되었습니다 ㅋㅋ 참 코딩은 알다가도모르겠네요..ㅠ 지금 웹디 2년차인데 10월에 이직계획으로 8월부터 포트폴리오 계속 만들어야할거같은데 2달동안 열심히 해야겠네요... 웹디자인기능사 자격증은있어서 기본적인 구조나 코딩은 이해하겠는데 자꾸 뭔가 막히니 답답한느낌.. 하지만 열심히 계속 달려보겠습니다
코딩웍스(Coding Works)
지식공유자
네. 다음 주에 개인포트폴리오 홈페이지 제작 가이드 PDF 강의가 오픈됩니다. 이직 계획 보니까 딱 맞을 거 같으니까 관심 갖고 한번 봐 주세요~
0
0
코딩웍스(Coding Works)
지식공유자
일단 영상이 마무리가 안된 상태에서 질문이시면 먼저 영상을 마무리해서 보세요.
그리고 스크린 샷이 없으면 원인 파악이 어렵습니다. 스크린 샷을 올려주세요.
절대주소로 되어 있는데 상대주소로 링크하시는게 좋습니다.
확인하셨다는 말씀은 해결되셨다는 말인가요?