我正在将视差效果添加到我的“联系页面”的背景中。不幸的是,我的Css样式表没有响应放置的背景图像,所以我决定测试背景颜色,确定我的背景是不同的颜色,但如何用图像替换该颜色?
<!--html-->
<div class="container" id="contact"><!--container-fluid 2 begins-->
<div class=" address column2">
<h1><span class="glyphicon glyphicon-home"></span> Address:</h1>
<p> 292250 Ace Center Dr. 1022</p>
<p> Houston, Texas 77518 </p>
</div>
<div class="email column2">
<h2><span class="glyphicon glyphicon-envelope"></span> Email:</h2>
<p>broo@gmail.com</p>
</div>
<div class="phonenumber column2">
<h2><span class="glyphicon glyphicon-phone-alt"></span> Phone Number: </h2>
<p>1(832)555-9209</p>
</div>
<div class="social column2">
<h2><span class="glyphicon glyphicon-user"></span> Social Connection</h2>
<p><a class="btn btn-default" href="https://www.facebook.com/brooks.7739" role="button">Facebook »</a>
<a class="btn btn-default" href="https://www.linkedin.com/pub/brooks- mmis/5b/97/7a4" role="button">LinkedIn »</a></p>
</div>
</div><!--container-fluid"2 ends-->
<!--CSS-->
#contact{
background-image: url("img/contact.jpg");
background-size: cover;
background-attachment: fixed;
background-color: #dddddd;
color: white;
padding:100px;
padding-top: 35px;
height: 600px;
z-index: 1;
}
<!--JS-->
<script type="text/javascript">
var $root = $('html, body');
$('.navbar-nav a').click(function() {
var href = $.attr(this, 'href');
$root.animate({
scrollTop: $(href).offset().top
}, 500, function () {
window.location.hash = href;
});
return false;
});
</script>