使用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. bzoj1830 Y形项链

    Description 小可可得到了一个可爱的Y型项链.小可可现在的项链是这个样子的:项链的最中间有一颗大珍珠作为结合点,从大珍珠上连出来3条由各种宝石串起来的链子.小可可希望让这3个链子完全一样,她 ...

  2. SpringMVC 实现返回一段数据 & 实现自动发送json格式数据 - AJAX

    实现返回一段数据 - AJAX 当页面通过AJAX来访问Controller时,期望得到的不是一个页面而是一段数据,此时可以使用如下方法,直接向相应中写入数据: /** * 直接向响应中写出数据,通常 ...

  3. ios ideviceintaller安装

    1.安装brew 打开终端输入: /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/inst ...

  4. String intern()方法详解

    执行以下代码 String a1=new String("abc");       String a2=new String("abc");       Sys ...

  5. 当vcenter是linux版本的时候Sysprep存放路径

    为 VMware vCenter Server Appliance 安装 Microsoft Sysprep 工具在从 Microsoft 网站下载并安装 Microsoft Sysprep 工具之后 ...

  6. java如何写自己的native方法实现调用本地的c++库?

    等待编辑 1:首先可以找一本jni    java native interface相关的书籍来看.

  7. 第3章 文件I/O(3)_内核数据结构、原子操作

    3. 文件I/O的内核数据结构 (1) 内核数据结构表 数据结构 主要成员 文件描述符表 ①文件描述符标志 ②文件表项指针 文件表项 ①文件状态标志(读.写.追加.同步和非阻塞等状态标志) ②当前文件 ...

  8. 代码生成器 CodeSmith 的使用(四)

    在上一篇的版本中,我们生成了数据库中的字段,使生成的属性更加简洁,可读性也提高了很多,但都是钍对一个数据库的单个表,如果要将数据库中的所有 的表都生成相应的类,表中的字段也都生成属性,运行一次就可以将 ...

  9. MacBook Pro 一月使用体验

    从 2013 年开始,就特别想买 MBP,终于在 2015 年的尾巴用上了 MBPR.原本是要在使用一周后写一份使用体验的,但因为懒,现在拖到一个月了,刚好现在也是2016年的一月,就把标题改成一月使 ...

  10. leetcode292

    public class Solution { public bool CanWinNim(int n) { //如果要赢,最后3个必须是自己来拿 //也就是最后剩1,2,3是胜利, //如果剩4枚, ...