none
CSS的float和clear属性的问题 RRS feed

  • 问题

  •     <div style="float: left; background-color: Blue;">
            左
        </div>
        <div style="clear: none; background-color: Red;">
            中
        </div>
        <div style="float: right; background-color: Yellow;">
            右
        </div>




    为什么这三个div没有在一行上,按照float和clear的意思,我觉得应该在一行上
    • 已移动 Sheng Jiang 蒋晟 2009年10月11日 20:36 客户端HTML问题 (发件人:ASP.NET 与 AJAX)
    2009年10月10日 8:10

答案

  •  <div style="float: left; background-color: Blue; width:30%; height:20px">
            左
        </div>
        <div style="  float:left;  background-color: Red; width:40%; height:20px">
            中
        </div>
        <div style="float: right; background-color: Yellow; width:30%; height:20px">
            右
        </div>
    第一 需要设置宽度 高度 一个div默认宽度是100% 排一行没有空间强制换行
    第二 clear:none 所有元素默认都是none  不需要设置
    • 已标记为答案 m s 2009年10月10日 9:57
    • 取消答案标记 m s 2009年10月10日 9:57
    • 已标记为答案 m s 2009年10月10日 10:02
    2009年10月10日 8:37
  •  
    <div style=" width:1024px; margin:0"> <div style="float: left; background-color: Blue; width:30%; height:20px">
            左
        </div>
        <div style="  float:left;  background-color: Red; width:39%; height:20px">
            中
        </div>
        <div style="float: right; background-color: Yellow; width:30%; height:20px">
            右
        </div> </div>
    • 已标记为答案 m s 2009年10月10日 9:57
    2009年10月10日 9:23

全部回复

  •  <div style="float: left; background-color: Blue; width:30%; height:20px">
            左
        </div>
        <div style="  float:left;  background-color: Red; width:40%; height:20px">
            中
        </div>
        <div style="float: right; background-color: Yellow; width:30%; height:20px">
            右
        </div>
    第一 需要设置宽度 高度 一个div默认宽度是100% 排一行没有空间强制换行
    第二 clear:none 所有元素默认都是none  不需要设置
    • 已标记为答案 m s 2009年10月10日 9:57
    • 取消答案标记 m s 2009年10月10日 9:57
    • 已标记为答案 m s 2009年10月10日 10:02
    2009年10月10日 8:37
  •  
    <div style=" width:1024px; margin:0"> <div style="float: left; background-color: Blue; width:30%; height:20px">
            左
        </div>
        <div style="  float:left;  background-color: Red; width:39%; height:20px">
            中
        </div>
        <div style="float: right; background-color: Yellow; width:30%; height:20px">
            右
        </div> </div>
    • 已标记为答案 m s 2009年10月10日 9:57
    2009年10月10日 9:23