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. JDBC 学习复习6 学习与编写数据库连接池

    之前的工具类DBUtil暴露的问题 用户每次请求都需要向数据库获得链接,而数据库创建连接通常需要消耗相对较大的资源,创建时间也较长.假设网站一天10万访问量,数据库服务器就需要创建10万次连接,极大的 ...

  2. 简单标签(SimpleTag) 学习

    一.由于传统标签使用三个标签接口来完成不同的功能,显得过于繁琐,不利于标签技术的推广, SUN公司为降低标签技术的学习难度,在JSP 2.0中定义了一个更为简单.便于编写和调用的SimpleTag接口 ...

  3. Linux 配置jdk vim和 Linux 基本操作

    1下载jdk tar.gz 安装包(http://www.oracle.com/) 注意安装机器的Linux 是x86(32位)还是x64(64位)的 2使用tar -zxvf jdk.tar.gz解 ...

  4. MMU简介

    MMU(Memory Management Unit)内存管理单元 负责虚拟地址到物理地址的映射,并提供硬件机制的内存访问权限检查.内存访问权限的检查可以保护每个进程所用的内存不会被其他进程所破坏 地 ...

  5. sed & awk 概述

    概述 一般情况下,从grep到sed和awk的学习过程是很自然的.sed和awk是一般用户.程序员和系统管理员们处理文本文件的有力工具. sed的名字来源于其功能,它是个字符流编辑器(stream e ...

  6. 切换composer国内镜像 Laravel China停用,切换阿里云composer全量镜像

    composer config -g repo.packagist composer https://packagist.phpcomposer.com Laravel China 镜像完成历史使命, ...

  7. 浅谈sass与less区别优缺点

    Sass是一种动态样式语言,Sass语法的缩排语法,比Css比多出很多功能,如变量,嵌套,运算,继承,颜色处理,函数等,易于阅读.Cass的安装需要安装Ruby环境,是服务器端处理的,Less是需要引 ...

  8. python的类和对象(1)

    类和对象 现在这年头,怎么哪里都有对象?街上看了一路手拉手,回来学习还要看到"对象". 是不是学会了对象,就有对象了? 1.定义: 百度解释: 对象是对客观事物的抽象,类是对对象的 ...

  9. TensorFlow utils

    1. def model_stats(): print("============================================================" ...

  10. Python基本语法变量

    Python的语法和其它编程语言的语法有所不同,编写Paython程序之前需要对语法有所了解,才能编写规范的Python程序.本篇介绍Python标识符的同时,也讨论了Python变量的声明和赋值.通 ...