2016-08-07 2 views
-1

그래서, 내 포트폴리오를 만들려고했습니다. 나는 이력서를 다운로드하기 위해 여분의 버튼을 추가했는데 모든 것이 응답하지 않게되었고 이력서 버튼을 삭제 한 후에도 반응이 없습니다. 문제가 어디 있는지 모르겠습니다. 나는 대부분의 매개 변수를 변경하려고 시도했다.html 파일을 다시 응답 가능하게 만들려면 어떻게해야합니까?

.nav-pills{ 
 
    
 
    font-size: 2.2em; 
 
    background-color:black; 
 
    margin-bottom: 16%; 
 
} 
 
body{ 
 
\t background-color: none; 
 
\t font-family: Lobster; 
 
\t color: white; 
 
    position: relative; 
 

 
} 
 
.pageone{ 
 
\t background: url("https://hd.unsplash.com/photo-1419242902214-272b3f66ee7a"); 
 
\t background-size: cover; 
 
\t height: 700px; 
 
\t border-top: 4%; 
 

 
} 
 
.container-fluid{ 
 
\t margin-left: auto; 
 
\t margin-right:auto; 
 

 

 
} 
 
h1{ 
 
\t padding: 0px; 
 
\t margin-top:0px; 
 
\t font-size: 6em; 
 
} 
 
.btn-default{ 
 
\t background: black; 
 
\t border-color: black; 
 
\t color: #337aa9; 
 
\t font-size: 1.4em; 
 

 
} 
 
.boxone{ 
 
\t background-color: black; 
 
\t opacity: 0.8; 
 
\t width: 50%; 
 
\t margin-right: auto; 
 
\t margin-left: auto 
 
} 
 

 
.pagetwo{ 
 
\t background: url("https://hd.unsplash.com/photo-1465101046530-73398c7f28ca"); 
 
\t background-size: cover; 
 
\t height: 680px; 
 
\t 
 
\t padding-top: 5% 
 
} 
 
p{ 
 
\t font-size: 2.0em; 
 
} 
 
.dp{ 
 
\t padding: 16%; 
 
\t border-radius: 50% 
 
}
<html> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Lobster" /> 
 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
 

 
<Head> 
 
<title>Puneeth</title> 
 
</Head> 
 

 
<div class="pageone text-center"> 
 
<div class="container-fluid"> 
 
<ul class="nav nav-pills"> 
 
<li><a href="#">Puneeth S</a></li> 
 
<li class="pull-right"><a href="#">Contact</a></li> 
 
<li class="pull-right"><a href="#">Portfolio</a></li> 
 
<li class="pull-right"><a href="#">About</a></li> 
 
<li class="pull-right"><a href="#">Home</a></li> 
 
</ul> 
 
</div> 
 

 

 
<div class="boxone "> 
 
<h1>Puneeth S</h1> 
 
<h3>Engineer by chance, Developer by choice</h3> 
 
</div> 
 
<div class="btn-list text-center"> 
 
<a class="btn btn-default" href="#">Resume</a> 
 
<a class="btn btn-default" href="#">Facebook</a> 
 
<a class="btn btn-default" href="#">Twitter</a> 
 
<a class="btn btn-default" href="#">Linkedin</a> 
 
<a class="btn btn-default" href="#">Github</a> 
 
</div> 
 
</div> 
 

 
<div class="pagetwo"> 
 
<div class="row"> 
 
<div class="col-md-6 col-lg-6 col-sm-12 col-xs-12"> 
 
<img src="https://s20.postimg.org/uguojmpvx/abcd.jpg" alt="trial" class="dp"> 
 

 

 
</div> 
 
<div class="col-md-6 col-lg-6 col-sm-12 col-xs-12"> 
 
<h1 class="text-center">Puneeth S</h1> 
 
<p class="text-center">"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p> 
 

 

 
</div> 
 
</div> 
 
</div> 
 
</html>

답변

1

당신은 .pagetwo 블록에 .container.row 클래스를 포장한다 :

<div class="pagetwo"> 
    <!-- `.container` element eliminates negative horizontal margins from `.row` --> 
    <div class="container"> 
    <div class="row"> 
     <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12"> 
     <img src="https://s20.postimg.org/uguojmpvx/abcd.jpg" alt="trial" class="dp"> 
     </div> 
     <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12"> 
     <h1 class="text-center">Puneeth S</h1> 
     <p class="text-center">"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p> 
     </div> 
    </div> 
    </div> 
</div> 
+1

감사 톤. 그것은 효과가 ... : D 괜찮 으면, 당신은 논리를 설명 할 수 있습니까? 나는 그것이 왜 효과가 있었는지 알 수 없다. – puneeth8994

+0

.row 요소는 내부 요소에 음의 수평 여백을 추가하기 때문에. 이것은'.row'로 요소를 래핑 할 때 가로 스크롤 막대가 있기 때문입니다. 이러한 음수 마진을 제거하려면'.row' 요소를'.container'에 래핑해야합니다. – 1ven

+0

유용 할 경우 대답을 승인 된 것으로 표시하십시오. :) – 1ven

관련 문제