css:

 .div-inline{ display:inline}

html:

 <div class="div-inline">第一个div盒子</div>

 <div class="div-inline">第二个盒子</div>

 <div class="div-inline">第三个盒子</div>

完整代码：

 <%@ page language="java" contentType="text/html; charset=UTF-8"

     pageEncoding="UTF-8"%>

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 <html>

 <head>

 <style type="text/css">

 .div-inline{ display:inline}

 </style>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

 <title>Insert title here</title>

 </head>

 <body>

 <hr>

 <div class="div-inline">第一个div盒子</div>

 <div class="div-inline">第二个盒子</div>

 <div class="div-inline">第三个盒子</div>

 </body>

 </html>

三个div并排

三个div并排的更多相关文章

  1. （转）css中通常会用到浮动与清除，也是一个必须掌握的知识点，概念性的东西不多说，下面举几个例子，来说明它的用法：1.文字环绕效果 2.多个div并排显示 3.清除浮动（默认显示）

    一.文字环绕效果: html代码如下: 1 <body> 2 3 <style type="text/css"> 4 #big img {float: le ...

  2. NO.14 两个div并排，左边为绝对宽度，右边为相对宽度

    两个div并排,左边为绝对宽度,右边为相对宽度,这个问题,我也经常遇到,我一般的处理方法是将最大的容器padding-left固定宽度,左边的固定宽度的一块position:absolute,然后ri ...

  3. 让两个Div并排显示

    一.使用display的inline属性 <div style="width:300px; height:auto; float:left; display:inline"& ...

  4. html中怎么样让div并排显示

    html中的div默认是流式显示,每个div会占用一整行 <html> <head> <meta http-equiv="Content-Type" ...

  5. 在HTML中实现两个div并排显示

    在HTML中让两个div并排显示,通常情况下有三种实现方式,包括: (1)设置为行内样式,display:inline-block (2)设置float浮动 (3)设置position定位属性为abs ...

  6. div+css:两个div并排等高 (table-cell)

    两个div并排等高 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  7. css两个form不换行，两个div并排代码

    1.form不换行通过table布局实现 <table> <tr> <td> <form method="get" action=&quo ...

  8. xHTML+div布局：三个div,两边div宽度固定，中间div宽度自适应

    xHTML+div经常考题:三个div,两边div宽度固定,中间div宽度自适应. 和大家分享一个实现方式: 1.html代码 <div class="dyleft"> ...

  9. 两个DIV并排显示

    今天做的一个项目,需要做3个div,一个是总框(Div1),另外两个是子框,按比例填满div1,我设置好两个div的width和height,发现效果是两个子div上下显示,如图所示: 要想将两个DI ...

随机推荐

  1. Base64编码为什么会使数据量变大

    现在工作中把视频转成base64发现数据量过大无法下载. 1.为什么base64编码会使数据量变大呢? Base64编码的思想是是采用64个基本的ASCII码字符对数据进行重新编码.它将需要编码的数据 ...

  2. kafka之基本介绍

    什么是kafka? Kakfa起初是由LinkedIn公司开发的一个分布式的消息系统,后成为Apache的一部分,它使用Scala编写,以可水平扩展和高吞吐率而被广泛使用.目前越来越多的开源分布式处理 ...

  3. 数据结构与算法（周测2-AVL树）

    判断题 1.The inorder traversal sequence of an AVL tree must be in sorted (non-decreasing) order.      T ...

  4. input 默认提示文字 样式修改(颜色,大小,位置)

    input::-webkit-input-placeholder{ color:red; font-size:20px; ...... }

  5. Golang内存管理

    Golang 内存管理 原文链接[http://legendtkl.com/2017/04/02/golang-alloc/] Golang 的内存管理基于 tcmalloc,可以说起点挺高的.但是 ...

  6. centos7安装harbor

    harbor是什么? docker容器是集装箱,harbor就是放集装箱的港湾. 一.下载软件: github上选择对应版本下载 https://github.com/goharbor/harbor/ ...

  7. spring-security原理学习

    spring security使用分类: 如何使用spring security,相信百度过的都知道,总共有四种用法,从简到深为:1.不用数据库,全部数据写在配置文件,这个也是官方文档里面的demo: ...

  8. 阿里P7告诉你什么是java并发包、线程池、锁

    并发包 java.util.concurrent从jdk1.5开始新加入的一个包,致力于解决并发编程的线程安全问题,使用户能够更为快捷方便的编写多线程情况下的并发程序. 同步容器 同步容器只有包括Ve ...

  9. insert buffer/change buffer double write buffer，双写 adaptive hash index（AHI） innodb的crash recovery innodb重要参数 innodb监控

    https://yq.aliyun.com/articles/41000 http://blog.itpub.net/22664653/viewspace-1163838/ http://www.cn ...

  10. VMware Workstation 14 安装使用 （小白安装使用教程）

    在一台 PC 上运行多个操作系统,借助 VMware Workstation Pro,您可以在同一台 Windows 或 Linux PC 上同时运行多个操作系统.创建真实的 Linux 和 Wind ...