Bootstrap input-group-addon不起作用

时间:2013-07-27 22:45:31

标签: html twitter-bootstrap twitter-bootstrap-3

我刚从bootstrap 2.3.2升级。
我从文档中复制/粘贴了示例,但附加组件对。中的字符没有影响。

我正在尝试的代码:

<div class="input-group">
    <span class="input-group-addon">@</span>
    <input type="text" class="form-control" placeholder="Username">
</div>

在没有背景或任何东西的情况下,@看起来像是正常的。

我做错了什么?

1 个答案:

答案 0 :(得分:15)

我发现您的代码没有问题,请参阅:http://bootply.com/69981 您从2.3.2迁移到3 RC1?我认为你包括错误的CSS。在主站点(http://twitter.github.io/bootstrap/)上,您将找到Bootstrap 3的文档。 Twitter的Bootstrap 2.3.2的文档转移到http://twitter.github.io/bootstrap/2.3.2/

您现在无法下载版本3的已编译CSS。但是你可以从Github(https://github.com/twbs/bootstrap/tree/3.0.0-wip)下载代码并用Grunt编译它。或者使用CDN:http://blog.netdna.com/opensource/bootstrapcdn/bootstrapcdn-now-serving-3-0-0-rc1/

Bootstrap 3将于2013年8月19日发布,请参阅:http://blog.getbootstrap.com/2013/07/18/ante-up/

Twitters Bootstrap 2.3.2:

<div class="input-prepend">
    <span class="add-on">@</span>
    <input class="span2" id="prependedInput" type="text" placeholder="Username">
</div>

Bootstrap 3.0.0 (RC1)

<div class="input-group">
  <span class="input-group-addon">@</span>
  <input type="text" class="form-control" placeholder="Username">
</div>