我想减少jumbotron的高度,而不是像素,而是百分比(例如div的高度,窗口高度)。使用不同窗口大小和响应式设计的最佳方法是什么。
这是我的代码:
<!-- START PAGE CONTENT WRAPPER -->
<div class="page-content-wrapper">
<!-- START PAGE CONTENT -->
<div class="content">
<div class="social-wrapper">
<div class="social " data-pages="social">
<!-- START JUMBOTRON -->
<div class="jumbotron" data-pages="parallax" data-social="cover">
<div class="cover-photo">
<img alt="Cover photo" src="assets/img/social/cover.png" />
</div>
<div class="container-fluid container-fixed-lg sm-p-l-20 sm-p-r-20">
<div class="inner">
<div class="pull-bottom bottom-left m-b-40">
<h5 class="text-white no-margin">Team Members</h5>
<h1 class="text-white no-margin"><span class="semi-bold">Lemp</span> Team</h1>
</div>
</div>
</div>
</div>
<!-- END JUMBOTRON -->
</div>
<!-- END PAGE CONTENT -->
感谢。
答案 0 :(得分:1)
您可以使jumbotron保持纵横比。
检查Sean Dempsey小提琴。
只需修改
<div class="box sixteen-nine">
<div class="content">
<span>16:9</span>
</div>
到您的jumbotron
你可以看到Chris Coyer full explanation