使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示。

示例如下:

 <div   class="search_row">
<div class="form-group" style="float:left" > <%-- 通过左浮动使多个div在一行显示--%>
<div class="search_label" >图书名称:</div> <input type="text" class="editText" name="bookName" />
</div>
<div class="form-group" style="float:left" >
<div class="search_label" >出版社:</div> <input type="text" class="editText" name="publisher" />
</div>
<div style="clear:both"></div> <%--清除浮动--%>
</div>

注意:记得清除浮动,不然后续会出现偏差。

效果如下:

css:多个div在同一行显示的更多相关文章

  1. html/css 两个div在同一行

    在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...

  2. 如何让两个div在同一行显示?一个float搞定

    最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...

  3. CSS文字超出div或者span时显示省略号

    我们常常需要在文本过长时显示,将超出显示成省略号: 思想为: 首先设置宽度,然后让超出的部分隐藏如果有超出则在最后显示省略号让文本不换行 具体css代码为: .title{ width:200px;o ...

  4. 两个div在同一行显示

    栅格系统需要引用bootstrap插件 <script src="~/Scripts/BootStrap/bootstrap.js"> </script> ...

  5. CSS+DIV实现文字一行内显示,并且过多的文字以点来代替

    有些时候我们在使用CSS+DIV进行排版实现大量的文字的时候,为了页面的美观,这里需要将文字在div中一行显示,并且将过多的文字进行隐藏,以点号进行代替.当鼠标放上面的时候会以title的形式显示所有 ...

  6. 如何利用CSS代码使图片和文字在同一行显示且对齐

    对于初学css的新手朋友来说,经常会遇到这样一个问题,当文字和图片出现在同一行或者同一个div里面的时候,在浏览器中运行出来的显示效果往往是在不同的行,那么,我们怎么才能利用CSS代码使图片和文字在同 ...

  7. CSS控制图片和文字在同一行显示且对齐的3种方法

    CSS控制图片和文字在同一行显示且对齐的3种方法 在 HTML 代码中,有时会需要在文字旁边加上一个图标. 默认情况,是图片置顶对齐,文字置底对齐,所以通常图片高,文字低,不能水平居中对齐. 常见方法 ...

  8. 【css flex】将多个<div>放在同一行

    使用style里的flex属性 默认情况下,一个div独占一行 使用css选择器给外层div加上以下flex属性,则该div的子div可以在同一行中显示, .runs-paginator-flex-c ...

  9. 多个div 一行显示的处理方式

    1.方式一: 通过div的float属性,定义宽度,然后定义float属性和width的属性,实现多个div在一行显示: 2.方式二: 通过div的display的属性,至少进行2成div的displ ...

随机推荐

  1. js判断是android访问还是ios访问

    原文地址:http://blog.csdn.net/wy978651775/article/details/9014039 该博主也是转载的,但是没有标明出处. 判断原理: JavaScript是前端 ...

  2. [UE4]蓝图Get Control Rotation获取人物角色朝向,设置默认人物相机,朝向与controller绑定

    具体应用:控制人物移动方向 也可以使用“CombineRotators”将角色控制器Z轴旋转90°,然后再取正面方向,达到跟“Get Right Vector”一样的效果: 设置关联人物朝向使用控制器 ...

  3. VMware仅主机模式访问外网

    原文转载至:https://blog.csdn.net/eussi/article/details/79054622 保证VMware Network Adapter VMnet1是启用状态  将可以 ...

  4. 高通QMI协议

    QMI(Qualcomm MSM Interface,官方名称应该是Qualcomm Message Interface)是高通用来替代OneRPC/DM的协议,用来与modem通信. QMI协议定义 ...

  5. 网络虚拟化中的 offload 技术:LSO/LRO、GSO/GRO、TSO/UFO、RSS、VXLAN

    offload offload特性,主要是指将本来在操作系统协议栈中进行的一些数据包处理(如IP分片.TCP分片.重组.checksum校验等)放到网卡硬件中去做,降低系统 CPU 消耗,提高处理的性 ...

  6. uva-639-枚举

    题意: 象棋里的車可以吃横竖的車,题目加了一个墙,用于阻断攻击,问4x4的棋盘最多可以放多少只車, 思路:枚举每一个点,2^16次方种情况 #include<stdio.h> #inclu ...

  7. aix-syslog

    收集网络内路由器的日志信息,同时把本地日志信息与路由器信息分开. /etc/syslog.conf我写成: ## 本地日志处理 *.notice;*.err;*.warn<tab>;< ...

  8. centos7.3nginx配置二级域名过程

    nginx1.10.2 1先检查 /etc/nginx/nginx.conf 是否include  conf.d include /etc/nginx/conf.d/*.conf; 默认都是包含的,如 ...

  9. CENTOS系统安装及初始化配置相关

    一,配置网卡: 1,设置网卡ip地址:vi   /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0TYPE=EthernetONBOOT=yes ...

  10. HTML5 Canvas ( 图形变换, 升级版的星空 ) translate, rotate, scale

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...