我一直在处理这个菜单,我无法将我的菜单部分显示在同一行中。到目前为止,我一直在讨论如何在bootstrap的网站下嵌套行。任何帮助表示赞赏!提前致谢!这就是我到目前为止所做的:
<div class="row">
<div class="menu container-fluid">
<div class="row">
<div class="dropdownn col-xs-12 col-md-6">
<button class="btn dropdown-toggle" type="button" id="espressoDrinks" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Espresso Drinks
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="espressoDrinks">
<ul>
<li>Espresso</li>
<p>2 oz. 4 oz. or 6 oz. of the finest pure espresso</p>
<li>Americano</li>
<p>Fresh brewed espresso with hot water</p>
<li>Macchiato</li>
<p>Espresso with a dallop of foam</p>
<li>Cappuccino</li>
<p>Espresso with steamed milk, topped with a crown of foam</p>
</ul>
</ul>
</div>
</div>
<!-- </div> -->
<div class="row">
<div class="dropdown col-xs-12 col-md-6">
<button class="btn dropdown-toggle" type="button" id="blendedEspresso" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Blended Espresso Shakes
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="blendedEspresso">
<ul>
<li>Blended Bliss</li>
<p>Espresso, chocolate and lowfat ice milk blended into a refreshing shake, topped with whipped cream. Delicious!</p>
<li>Java Chill</li>
<p>Brewed espresso blended with lowfat ice milk, a splash of a flavor of your choosing, and topped with whipped cream</p>
<li> White Mocha Chill</li>
<p>Blended Ghirardelli white chocolate mocha capped with whipped cream</p>
<li>Malty-Malt</li>
<p>Blended chocolate mocha with malted milk and topped with whipped cream</p>
<li>Minty-Mint</li>
<p>Blended mocha spun with a whole peppermint patty and topped with cream</p>
</ul>
</ul>
</div>
</div>
</div>
</div>
<!-- begin snippet: js hide: false -->
答案 0 :(得分:0)
据我所知,.row类用于组织嵌套和/或.col-xxx类。因此,您的所有.row必须放在一个.container中 然后,如果要在.rows中组织内容,则必须将内容放在.col-xxx中。
<div class="container">
<div class="row">
<div class=".col-md-6"></div><div class=".col-md-6"></div>
</div>
<div class="row">
<div class=".col-md-6"></div><div class=".col-md-6"></div>
</div>
</div>