zoukankan      html  css  js  c++  java
  • DIV设置浮动float以后下一个DIV要换行的方法

    《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

  • 相关阅读:
    Community Server(CS)是一个非常优秀的Asp.net开源软件
    乐在其中设计模式(C#)
    VSTO+WinForm+WebService+WCF+WPF示例
    系出名门 Android 系列文章索引
    DataTable 和List 相互转换
    C#异步TCP通讯类库FlyTcpFramework
    WCF+BizTalk开发系列
    精通MVC 3 框架
    我对架构的理解
    DataTable转换成IList
  • 原文地址:https://www.cnblogs.com/mq0036/p/4604443.html
Copyright © 2011-2022 走看看