Question

我正在尝试在bootstrap导航栏中创建一个搜索框我就像在bootstrap网站上的示例中那样做。我的搜索框中也有一个插件。出于某种原因，inout框不是圆形的。这就是它现在的样子：

我希望左侧也像插件的右侧一样圆润。以下是我的代码：

<form class="navbar-form navbar-left" id="search" role="search">                                    
                                <button id="search-button" type="button" class="btn btn-info">
                                    <span class="glyphicon glyphicon-search"></span>
                                </button>                                   
                                <div id="search-form" class="form-group">
                                    <div class="input-group">                                       
                                        <input type="text" class="form-control" id="search-input" placeholder="Search">
                                        <span id="search-icon" class="input-group-btn">
                                            <button class="btn btn-info">
                                                <span class="glyphicon glyphicon-search"></span>
                                            </button>
                                        </span>
                                    </div> 
                                </div>
                            </form>

我还有一些额外的ID可以在框中添加消除功能，就像在this tutorial中一样。

添加我的CSS之后，我意识到我重写了它，我已经修复了CSS，现在它正在工作。 Thanx对你的帮助，如果你们不建议发布我的CSS我就不会找到它。

Answer 1

尝试将此项用于要更改边框半径的类：将此应用于css文件中的html类

border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-left-radius: 5px;

如果这有助于你，请投票。

Boostrap输入不再舍入

1 个答案: