왜 전 선생님과 화면이 다를까요?
365
gudghk04305966
5 asked
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부분이 위로 안올라오고 아래로 자꾸 떨어지는데.. 왜그럴까요?
jquery
HTML/CSS
반응형-웹
Answer 3
0
확인했습니다 ㅎ.
0
네 어디가 오류인지모르겠지만... 다시 싹 지우고 마음을 비우고 처음부터 다시 하드코딩해봤떠니 되었습니다 ㅋㅋ 참 코딩은 알다가도모르겠네요..ㅠ 지금 웹디 2년차인데 10월에 이직계획으로 8월부터 포트폴리오 계속 만들어야할거같은데 2달동안 열심히 해야겠네요... 웹디자인기능사 자격증은있어서 기본적인 구조나 코딩은 이해하겠는데 자꾸 뭔가 막히니 답답한느낌.. 하지만 열심히 계속 달려보겠습니다
0
일단 영상이 마무리가 안된 상태에서 질문이시면 먼저 영상을 마무리해서 보세요.
그리고 스크린 샷이 없으면 원인 파악이 어렵습니다. 스크린 샷을 올려주세요.
절대주소로 되어 있는데 상대주소로 링크하시는게 좋습니다.
하드코딩으로 이미지맵(image map) 만들기
1
79
2
슬릭 슬라이더
1
147
2
position: fixed; 가 안먹혀요..뭐가 문제일까요?
1
167
1
반응형 fixed 안먹히는 문제
1
264
2
선생님
2
155
1
.news-thum .date 위치가 안맞아요
1
245
2
TypeIt - Welcome 부분이 적용이 안됩니다..
1
369
2
Scroll Reveal Animation 적용이 안되요
1
362
1
완성 후 각 섹션 display:none 주석 시 문제
1
384
3
브라우저를 줄일 때 화면 깨짐
1
632
2
welcome-heading 부분이 왜 저렇게 위치되는지 모르겠습니다.
1
340
1
제이쿼리 탭메뉴 클릭 질문
1
236
1
질문있습니다
1
548
1
질문있습니다.
2
646
2
슬릭슬라이더가 왜 안되는지 모르겠습니다
1
621
1
slick slider와 .ceo-content영역 겹침
1
719
1
span .badge 부분 참고하실분 하세요
2
333
1
플렉스를 안주고 그냥 패딩을 줘도 되지 않나요
1
330
1
창을 줄이면 위치가 이동되는 백그라운드 이미지
1
531
1
크롬창을 줄어들면 이미지가 작아짐
1
742
1
scroll behavior 오류
1
263
1
선생님 코딩좀 봐주세요..
1
399
3
따라했는데 이상합니ㅏㄷ..ㅠ
1
291
2
flex로 된 부분을 좌우로 애니매이션 할때 발생하는 문제점.
1
206
1