Html 如何增加标题中搜索栏的宽度

Html 如何增加标题中搜索栏的宽度,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,我必须增加搜索栏的宽度,使边框不可见,同时保持移动响应。比如: http://oneclass.com/#!/notes HTML <a class="navbar-brand page-scroll" href="#page-top">dss</a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class

我必须增加搜索栏的宽度,使边框不可见,同时保持移动响应。比如:

http://oneclass.com/#!/notes
HTML

<a class="navbar-brand page-scroll" href="#page-top">dss</a>
</div>
    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav navbar-right">
            <li>
                <form class="navbar-form" role="search">
                    <div class="input-group">
                        <input type="text" class="form-control ipt" placeholder="Search" name="q">
                        <div class="input-group-btn">
                            <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
                        </div>
                    </div>
                </form>
            </li>
            <li>
                 <a  href="study_material.php">Study Material</a>
            </li>
            <li>
                 <a  href="about.php">About us</a>
            </li>
            <li>
                 <a  href="">Blog</a>
            </li>
        </ul>
    </div>
</div>


你可以用CSS来做。。。 只需向要编辑的类元素添加一些样式

我想你可以用这样的东西:

.ipt {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 0px;
  border-bottom: 1px solid #ccc;
  height: 50px;
  font-size: 25px;
  line-height: 45px;
}

你可以用CSS来做。。。 只需向要编辑的类元素添加一些样式

我想你可以用这样的东西:

.ipt {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 0px;
  border-bottom: 1px solid #ccc;
  height: 50px;
  font-size: 25px;
  line-height: 45px;
}

您可以将一些CSS添加到输入“text”标记中(此处带有ipt类)


你可以在这里查看一个简单的演示

您可以将一些CSS添加到输入“text”标记中(此处使用ipt类)

你可以在这里查看一个简单的演示