Javascript 角度引导中的响应菜单

我试图创建以下用户界面引导与响应菜单，谁能给我提供指导，我如何才能做到这一点。顶部和侧面菜单都应响应。 下面是我试图创建的URL

---

假设您了解web设计的基础知识，我将向您简要解释引导程序的工作原理

Bootstrap是自动处理响应的HTML、CSS和JS框架。您必须只正确地包含库，并且知道哪些引导css类也包含在HTML标记中

例如，如果要实现图形中搜索的设计零件，必须执行中的类似操作

或为

我将为您的问题的组件结构提供快速提示（当然，css中有很多工作：）：

走！






//侧边栏的HTML部分
//主要内容的HTML部分

您必须明智地包含准确的col lg、col md、col sm和col xs类，以达到每个浏览器大小的响应能力

最重要的事情之一也是学习这是不可避免的 用于组件组织。

只需像中一样练习，仔细学习引导css类和组织，之后，您将能够设计complexer产品

---

我希望我在理论上涵盖了使用Boostrap框架设计所需的所有内容

请将引导标签更改为twitter引导或twitter-bootstrap3以避免混淆，因为引导与设计无关……感谢arman1991，我将尝试一下。但理论上你是对的。

     <!--The header-->
        <div class="col-lg-12">    
            <div class="col-lg-12">
                            <div class="col-lg-3"> <!--Logo or whatever in top left side-->
                                <div class="col-xs-6 col-md-3">
                                  <a href="#" class="thumbnail">
                                      <img src="../Content/img/chrome_logo.jpeg" />
                                  </a>
                                </div>
                            </div>
            <div class="6"></div>
                <div class="col-lg-3" style="float:right"> <!--Search input-->
                  <div class="input-group">
                    <input type="text" class="form-control">
                    <span class="input-group-btn">
                      <button class="btn btn-default" type="button">Go!</button>
                    </span>
                  </div>
                </div>
            </div>

            <div class="col-lg-12" style="margin-left:40%" ><!-- Menu-->
                   <ul class="nav nav-pills">
                        <li role="presentation" class="active"><a href="#">Menu1</a></li>
                        <li role="presentation"><a href="#">Menu2</a></li>
                        <li role="presentation"><a href="#">Menu3</a></li> 
                        <li role="presentation"><a href="#">Menu4</a></li>
                    </ul>
             </div>
        </div>

<div class="col-lg-12">
   <div class="col-lg-2">
    //HTML PART FOR SIDEBAR
    </div>   
    <div class="col-lg-10">
       //HTML PART FOR MAIN CONTENT
    </div>
</div>