我是使用引导程序的新手，我想知道如何扩展搜索栏的长度。
我正在尝试创建Google主页的简化版本，但是引导搜索框比Google小得多。
有谁知道如何增加搜索框的宽度？
另外，我将如何在我的谷歌徽标周围添加填充？
我尝试在 CSS 中的 .logo {} 中添加填充顶部，但它似乎不起作用。
<!DOCTYPE html>
<html lang = "en">
<head>
<title>Simple Google Homepage</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/google_homepage.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="navbar-navbar-inverse-navbar-static-top" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" rel="home" href="/" title="Simple Google Homepage"></a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<ul class="nav navbar-nav">
<li><a href="https://plus.google.com/up/accounts/upgrade/?continue=https://plus.google.com/u/0/?gpsrc%3Dogpy0%26tab%3DwX&gpsrc=ogpy0">+You</a></li>
<li><a href="https://mail.google.com/mail/?tab=wm">Gmail</a></li>
<li><a href="images.google.com">Images</a></li>
<li><a href="blank"> <span class="glyphicon glyphicon-th"></span></a></li>
<li><a href="mail.google.com">example@gmail.com</a></li>
</ul>
<div class="col-sm-3 col-md-3 pull-right">
</div>
</div>
</div>
<div class = "logo" align = "center">
<img src = "https://www.google.com/images/srpr/logo11w.png" class = "Google" width= "269" height = "95">
<form class="navbar-form" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="" name="srch-term" id="srch-term">
</div>
</form>
</div>
</body
</html>
非常感谢您的反馈。
谢谢。
在你的 css 中使用它：
#srch-term {
width: 800px;
}
您可以将宽度更改为所需的任何宽度。
将此 CSS 部分添加到头部并相应地更改。
<style>
.logo{
padding-top: 150px;
}
.input-group{
padding: 10px;
width: 40%;
}
</style>
但是，如果您要添加另一个输入组，请充分注意，然后有一个 Id。