【发布时间】：2016-02-20 02:44:02
【问题描述】：
我正在尝试借助 Bootstrap 3 网格位置在 Bootstrap 3 中使用响应式设计，如您所见，我使用的是相同的位置，但是由于某种原因，图像不会与文本保持一致。有点偏左。
.ha-bg-parallax {
background: url(../image/bg.jpg) no-repeat fixed;
-moz-background-size: cover;
-o-background-size: cover;
-webkit-background-size: cover;
background-size: cover;
height: 100vh;
margin: 0 auto;
width: 100%;
display: table;
vertical-align: middle;
}
.ha-bg-parallax .ha-parallax-body {
display: table-cell;
vertical-align: middle;
}
.ha-bg-parallax .ha-content-whitecolor {
font-size: 17px;
color: #ffffff;
width: 45%;
margin: auto;
}
.ha-bg-parallax .ha-diamond-divider-md {
margin: 15px 0px;
}
.ha-bg-parallax .ha-heading-parallax {
font-style: italic;
font-weight: bold;
text-transform: none;
color: #ffffff;
padding-bottom: 0px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<div class="container-fluid">
<div class="row">
<div class="ha-bg-parallax text-center block-marginb-none" data-type="background" data-speed="20">
<div class="ha-parallax-body">
<div class="col-md-2 col-md-offset-5">
<img class="img-circle img-responsive" alt="me" src="http://puu.sh/ndUaw/59e5207430.jpg">
</div>
<div class="col-md-2 col-md-offset-5">
<h1><span class="element"></span></h1>
<a href="skype:edgaraxe">
<i class="fa fa-skype fa-3x"></i></a> <a href="https://keybase.io/edhusky">
<i class="fa fa-key fa-3x"></i></a> <a href="https://github.com/edgaraxe">
<i class="fa fa-github fa-3x"></i> </a> <a href="https://bitbucket.org/edhusky/">
<i class="fa fa-bitbucket fa-3x"></i></a> <a href="mailto: edhusky94@gmail.com">
<i class="fa fa-envelope fa-3x"></i></a>
</div>
</div>
<div class="ha-parallax-divider-wrapper">
<span class="ha-diamond-divider-md img-responsive"></span>
</div>
</div>
</div>【问题讨论】：
标签： html css twitter-bootstrap