【问题标题】:Align text box with menu control using bootstrap使用引导程序将文本框与菜单控件对齐
【发布时间】:2013-11-12 01:13:18
【问题描述】:

您好,我正在为我的 asp.net Web 应用程序使用引导样式,并且顶部有一个菜单控件。我想在菜单栏的同一行的右上角插入一个搜索文本框。以下是我的代码。谁能建议如何做到这一点?谢谢。

<div id="container">
    <form runat="server" class="navbar-form navbar-left" role="search">
    <div class = "navbar">          

        <div class="navbar-inner">
            <div class="container">
             <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
                <a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>

                <div class="nav-collapse collapse">
                    <asp:Menu ID="NavigationMenu" runat="server" EnableViewState="false"
                        IncludeStyleBlock="false" Orientation="Horizontal"
                        CssClass="navbar"
                        StaticMenuStyle-CssClass="nav"
                        StaticSelectedStyle-CssClass="active"
                        DynamicMenuStyle-CssClass="dropdown-menu">
                        <Items>
                            <asp:MenuItem Text="Home" ToolTip="Home"></asp:MenuItem>
                            <asp:MenuItem Text="Music" ToolTip="Music">
                                <asp:MenuItem Text="Classical" ToolTip="Classical" />
                                <asp:MenuItem Text="Rock" ToolTip="Rock" />
                                <asp:MenuItem Text="Jazz" ToolTip="Jazz" />
                            </asp:MenuItem>
                            <asp:MenuItem Text="Movies" ToolTip="Movies">
                                <asp:MenuItem Text="Action" ToolTip="Action" />
                                <asp:MenuItem Text="Drama" ToolTip="Drama" />
                                <asp:MenuItem Text="Musical" ToolTip="Musical" />
                            </asp:MenuItem>
                        </Items>
                    </asp:Menu>

          <div class="form-group">
            <input type="text" class="form-control" placeholder="Search"/>
        <button type="submit" class="btn btn-default">Submit</button>
          </div>    
          </div>                
            </div>          
        </div>
    </div>          
    </form>
    </div>
    `

【问题讨论】:

    标签: asp.net twitter-bootstrap


    【解决方案1】:

    尝试添加navbar-right 类。

    <div class="form-group" class="navbar-right">
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-06-11
      • 2012-06-23
      • 1970-01-01
      • 2018-06-17
      • 2021-09-07
      • 1970-01-01
      • 2015-03-08
      • 1970-01-01
      相关资源
      最近更新 更多