所以，我正在尝试创建我的投资组合。我添加了一个额外的按钮来下载简历，整个事情变得没有反应，即使我删除了简历按钮，它也没有反应。我不知道问题出在哪里。我尝试更改大部分参数。
.nav-pills{
font-size: 2.2em;
background-color:black;
margin-bottom: 16%;
}
body{
background-color: none;
font-family: Lobster;
color: white;
position: relative;
}
.pageone{
background: url("https://hd.unsplash.com/photo-1419242902214-272b3f66ee7a");
background-size: cover;
height: 700px;
border-top: 4%;
}
.container-fluid{
margin-left: auto;
margin-right:auto;
}
h1{
padding: 0px;
margin-top:0px;
font-size: 6em;
}
.btn-default{
background: black;
border-color: black;
color: #337aa9;
font-size: 1.4em;
}
.boxone{
background-color: black;
opacity: 0.8;
width: 50%;
margin-right: auto;
margin-left: auto
}
.pagetwo{
background: url("https://hd.unsplash.com/photo-1465101046530-73398c7f28ca");
background-size: cover;
height: 680px;
padding-top: 5%
}
p{
font-size: 2.0em;
}
.dp{
padding: 16%;
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>最佳答案
您应该将 .row 类包装在 .pagetwo block 中的 .container 中:
<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>
关于html - 如何使我的 html 文件再次响应？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38815746/