Question

代码看起来像这样..

<div class="container"><!-- container-->
    <div class="row">
        <div class="col-md-3" rowspan="2"><!-- brand logo-->
            <a href=""><image src="images/logo.png" class="img-responsive"></image></a>
        </div>

        <div class="col-md-9">
            <p class="pull-right">date&amp;time</p>
        </div>

        <div class="col-md-9">

            <nav class="navbar navbar-default"><!-- navbar-->
                <div class="container">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#kevalheader">
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>                        
                        </button>
                    </div>
                    <div class="collapse navbar-collapse" id="kevalheader">
                        <ul class="nav navbar-nav">
                            <li><a href="index.html">Home</a></li>
                            <li><a href="kevalservice.html">Service</a></li>
                            <li><a href="kevalprofile.html">Profile</a></li>
                            <li><a href="kevalcontact.html">Contact Us</a></li>
                        </ul>
                    </div>
                </div>
            </nav><!-- end of navbar-->

        </div>
    </div>
</div>

logo应该负责以及navbar-header ..当我这样做时，滚动条出现在底部..这可以通过删除导航中的coniner类来解决，但是在断点时它不会工作所以需要帮助。想要删除那个......也可以看到这个......很多在adv

Answer 1

就个人而言，我会避免使用rowspan标签，因为我发现在我的头脑中解析会让人感到困惑，我也不完全确定它在引导网格系统中是否受支持（如果有人有一些文件，我会很感激。）。

我会更专注于创建列和行。

我会让HTML看起来像这样：

<div class="container"><!-- container-->
    <div class="row">

        <div class="col-md-3"><!-- brand logo-->
            <a href=""><image src="images/logo.png" class="img-responsive"></image></a>
        </div>

        <div class="col-md-9">

            <div class="row">
                <div class="col-md-12">
                    <p class="pull-right">date&amp;time</p>
                </div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <nav class="navbar navbar-default"><!-- navbar-->
                        <div class="container">
                            <div class="navbar-header">
                                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#kevalheader">
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>
                                    <span class="icon-bar"></span>                        
                                </button>
                            </div>
                            <div class="collapse navbar-collapse" id="kevalheader">
                                <ul class="nav navbar-nav">
                                    <li><a href="index.html">Home</a></li>
                                    <li><a href="kevalservice.html">Service</a></li>
                                    <li><a href="kevalprofile.html">Profile</a></li>
                                    <li><a href="kevalcontact.html">Contact Us</a></li>
                                </ul>
                            </div>
                        </div>
                    </nav><!-- end of navbar-->
                </div>
            </div>

        </div>
    </div>
</div>

如何在Navbar上获取rowspan，bootstrap

1 个答案: