如何引导这些元素答案

【问题标题】：How to Bootstrap these elements如何引导这些元素
【发布时间】：2017-10-12 09:43:57
【问题描述】：

这可能看起来很奇怪，我想创建一个像 Stack Overflow 一样简单的标题，所以我一直在努力编写正确的代码。

<template name="DashboardLayout">
<hr>
    <div class="row">
        <div col-md-8 col-md-offset-9><center><input type="text" name="search" placeholder="Search.."></center> </div>
        <div col-md-4 ><center><label>Profile</label></center> </div>
        <div col-md-4 ><center><label>Settings</label></center> </div>
        <div col-md-4 ><center><label>Videos</label></center> </div>
        <div col-md-4 ><center><div class="dropdown">
          <div class="dropbtn">Dropdown</div>
          <div class="dropdown-content">
            <a href="#">Link 1</a>
            <a href="#">Link 2</a>
            <a href="#">Link 3</a>
          </div>
        </div></center> </div>
    </div>
<hr>
</template>

如何使用 Bootstrap 实现这一点？

【问题讨论】：

我正在使用流星 js blaze 模板。谢谢你。
编辑稍等。

标签： javascript html css meteor twitter-bootstrap-3

【解决方案1】：

你要什么？给你完整的 HTML 需要 CSS 和 JS 吗？

Check this link in Bootstrap 默认示例基本上就是你想要的。徽标、链接（文本或图标链接）、搜索栏和下拉菜单。全部响应。

然后，只需调整样式以获得更好的副本。

【讨论】：

【解决方案2】：

您可以做的是为现有标签添加一些自定义类，并为相应的类编写自己的样式。或者如果您需要简单的自定义版本，您可以使用this 更轻松地构建它或者这个https://work.smarchal.com/twbscolor/

阅读this，如果您想要更成熟的导航栏http://blog.jetstrap.com/2013/07/less-like-bootstrap/

【讨论】：