我目前正在Twitter Bootstrap中创建一个登陆页面并遇到了问题。该行中包含的行和跨度是由内容填充的。他们每个身高都是1px。
http://www.landing.xeonweb.com.au - 是网址
以下是代码:
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet" media="all">
<link href="css/bootstrap-responsive.css" rel="stylesheet" media="all">
<!--Bootstrap Js-->
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<div id="headerwrapper">
<div id="header" class="container">
<div class="row">
<div class="span5">
<div id="logo">
<img src="../img/logo.png" alt="Barrier Reef Pools Newcastle">
</div>
<div id="contactbutton">
<button class="btn btn-large btn-block btn-success" type="button">Contact Us</button>
</div>
</div>
<div class="span5">
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
<div class="item"><img src="img/majestichead.jpg" alt="Majestic Range" /></div>
<div class="active item"><img src="img/barrierhead.jpg" alt="Barrier Reef Range" /></div>
<div class="item"><img src="img/indulgencehead.jpg" alt="Indulgence Range" /></div>
</div>
<!-- Carousel nav -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
</div>
<!--end Row-->
</div>
<!--end Header-->
</div>
<!-end Head wrap-->
</div>
标题没有响应,我认为是因为这个?任何帮助将不胜感激。
答案 0 :(得分:0)
试试<div class="row-fluid">
而不是<div class="row">
答案 1 :(得分:0)
嗯,你搞砸了整个引导程序代码,最好的做法是在不同的css文件中编写自定义样式,而不是将它们包含在bootstrap主css中。
试试这个 -
Plz使用默认样式 -
<head>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrapcombined.min.css" rel="stylesheet">
</head>
<div class="container">
<div class="row">
<div class="span4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn" href="#">View details »</a></p>
</div>
<div class="span6">
<!-- Carousel code here-->
<!-- end carousel -->
</div>
</div>
</div>