zoukankan      html  css  js  c++  java
  • bootstrap如何把表单select input button弄在一行

            bootstrap很多折叠样式css都已经写好,可以直接用,很方便。但是,如果遇到一些bootstrap文档里面没有的例子,估计很多初学者都懵了,然后会折腾很久也未见得有效。今天主要讲如何把select input button弄在一行,因为直接用bootstrap的form-control样式会出现换行!只需要解决为何换行即可;form-control有个属性:100%,这个是产生换行的原因,所以覆盖form-control的100%样式为auto;即可。例子如下:

    1. <div class="form-group">
    2. <div class="input-group col-xs-12">
    3. <div class="input-group-btn">
    4. <select name="type" class="form-control" style=" auto;">
    5. <option value="1">全网</option>
    6. <option value="2">本站</option>
    7. </select>
    8. </div>
    9. <input type="text" name="keyword" id="keyword" class="form-control" placeholder="请您输入关键词">
    10. <span class="input-group-btn">
    11. <button class="btn btn-success" id="search_submit" type="submit">Go</button>
    12. </span>
    13. </div>
    14. </div>


  • 相关阅读:
    proxy
    javascript作用域链
    javascript技巧
    for of
    ES6模块与CommonJS模块有什么区别?
    DOM
    defer和async的区别
    浏览器如何解析css选择器?
    你是如何理解Vue的响应式系统的
    信息安全系统设计基础第十二周学习总结
  • 原文地址:https://www.cnblogs.com/jpfss/p/9476156.html
Copyright © 2011-2022 走看看