《div style=“float:left;”》 1111111 《/div》

《div style=“float:left;”》222222 《/div》

《div 》33333333《/div》

1111111 和222222  在同一行,接下来的33333333虽然没有float:left的属性,但是也会在同一行,

要想让33333333不在同一行怎么办呢,答案很简单就是加入clear:both;

《div style=“clear:both;”》33333333《/div》

这样就可以了解决div换行问题了。在div同一行设置之后进行换行。同样如果div之后是table的也可以。如下代码:

<div style="float:left;"> 1111111 </div>
<div style="float:left;">222222 </div>
<table style="clear:both">
<tr><td>tttttt</td></tr>
</table>

如果div后面是文本框或按钮之类的,

<div style="float:left;">页面内容</div><input type=text value=文本框 />

<div style="float:left;">页面内容</div><button>提交</button>

则无法在文本框或按钮上用style="clear:both",所以可以使用如下方法:

①在div后面是一<br />进行换行,如:<div style="float:left;">页面内容</div><br /><input type=text value=文本框 />

②在浮动的div后面增加一个空div并设置clear样式属性,如:<div style="float:left;">页面内容</div><div style="clear:both"></div><button>提交</button>

这样就可以解决浮动DIV换行的问题了。

参考出处:

http://blog.sina.com.cn/s/blog_6721f25c0101i1tk.html

http://www.jb51.net/css/221269.html

DIV设置浮动float以后下一个DIV要换行的方法的更多相关文章

  1. 外部盒模型大小固定 内部有边框div设置浮动时 缩放窗口内部div溢出的解决办法

    原因分析: chorme和firefox浏览器下当缩放窗口大小时,边框的计算宽度变大造成内部div宽度的计算宽度变大,外部div放不下内部div而溢出. 解决办法: 给内部div设置 box-sizi ...

  2. 同级div设置display:inline-block,父级div强制不换行

    同级div设置display:inline-block,父级div强制不换行 <html> <head></head> <body> <div i ...

  3. request设置属性 一般当做下一个页面的结果集

    request设置属性 一般当做下一个页面的结果集

  4. JS window对象 返回下一个浏览的页面 forward()方法,加载 history 列表中的下一个 URL。

    返回下一个浏览的页面 forward()方法,加载 history 列表中的下一个 URL. 如果倒退之后,再想回到倒退之前浏览的页面,则可以使用forward()方法,代码如下: window.hi ...

  5. 子div设置浮动无法把父div撑开。

    <div class="mainBox"> <div class="leftBox"></div> <div clas ...

  6. div的浮动(float)

    什么是浮动 浮动,故名思议,就是移动位置. 之所以不叫移动,而叫浮动,那是因为给元素设置浮动后,元素会浮到文档上面来,术语叫脱离文档流. 例子 下面我们看例子 <html> <hea ...

  7. 解决div设置浮动,高度消失

    给包围 浮动的层 加清除浮动样式,样式要兼容的用下面的代码.clearfix {*zoom:1; clear:both;}.clearfix:after{content:".";d ...

  8. html同行两个div浮动后下一个div怎么换行的问题

    传送门:https://blog.csdn.net/asdfg6541/article/details/78514535

  9. ViewPage+frament不预载入下一个Frament数据解决的方法

    在做一个ViewPage+Frament 滑动数效果,当滑动到每一页时载入哪一页的数据,可是ViewPage会预载入下一也数据.这个问题之前做项目是一直未解决,今天找到一个方法一下子就解决的这个问题, ...

随机推荐

  1. $百度应用引擎BAE的使用与应用部署

    百度应用引擎(BAE)是百度推出的网络应用开发平台,开发者使用BAE不需要进行服务器的配置.维护等繁琐的工作,也不需要进行域名的申请.备案等工作,而只需要上传自己的WEB应用即可在公网上访问.使用及部 ...

  2. Linux Shell基础 Shell基本知识

    概述 在 Linux 的脚本中,只要是基于 Bash语法写的Shell脚本第一行必须是"#!/bin/bash",用来声明此文件是一个脚本. 运行方式 Shell 脚本的运行主要有 ...

  3. 笔记:git和码云

    背景:之前使用GitHub,无奈网速原因,有时候竟无法连接,搜索解决方案而又鱼龙混杂淹没在信息的海洋. 于是尝试码云,界面简单,全中文,用起来很是顺手. 码云使用git来管理,操作上都是git的基本指 ...

  4. Mysql主从复制原理详解

    一.为什么要做主从同步 1.读写分离,降低对主数据库的IO消耗 2.避免数据丢失 3.提高业务系统性能 二.主从同步和集群的区别 1.主从同步 一般需要两台及以上数据库服务器即可(一台用于写入数据,一 ...

  5. easy_install

    一 setuptools 和easy_install setuptools:setuptools 是一组由PEAK(Python Enterprise Application Kit)开发的 Pyth ...

  6. HDU 4783 Clumsy Algorithm

    题意不提. 我们可以发现,可以将最终序列分为对于第i个位置i-pi>=0与i-pi<0种两个子序列.且如果f[n]==g[n],则有两个子序列都递增. 原因是f[n]表示1-n这个排列的逆 ...

  7. 递归实现N皇后问题

    其实是看到一位名为“活在二次元的伪触”的博主昨天还是前天写了篇这个题材的笔记,觉得有点意思,于是想自己来写写. 其实我发现上述那位同学写N皇后问题写得还不错,文末也会给出这位同学用通过递归的方法实现N ...

  8. winter 2018 02 01 关于模运算的一道题

    题目:给出一个正整数n,问是否存在x,满足条件2^x mod n=1,如果存在,求出x的最小值. 分析:1.若给出的n是1,则肯定不存在这样的x;     2.若给出的是偶数,2的次幂取余一个偶数得到 ...

  9. iOS_UIAlertController

    ViewController.m文件 #import "ViewController.h" @interface ViewController () // @property (n ...

  10. 新建maven web后controller不能被扫描到

    1.新建maven web 子工程 2.修改web.xml. 3.resources下建立spring.xml与springmvc.xml. 4.spring.xml删除对controller的扫描. ...