none
css 居中和float: left;怎么实现在一个层里 RRS feed

  • 问题

  • 实现这样的一个功能:
    <div id="header">
    //里面两个div:1.toplogo 2.topsearch
    <div id="toplogo">
    <a href="http://www.chemgogo.com" target="_self">
    <img src="http://www.chemgogo.com/image/logosmall.gif" title="全球化学品供求网" alt="chemgogo" /></a>
    </div>

    <div id="topsearch">
    <form action="http://www.chemgogo.com/show.aspx" method="post" name="qname" target="_blank" id="form2">
    <input name="qname" title="输入查询化学品中、英文名、CAS号"
    style="width: 212px" />
    <input type="submit" name="chemgogo" value="chemgogo"/>
    </form>
    </div>

    </div>

    布局成这样: image(left) search(居中)
    怎么实现,我弄了好久都不可以。
    • 已移动 孟宪会Moderator 2009年11月25日 6:54 (发件人:.NET Framework 一般性问题讨论区)
    2009年11月25日 5:04

答案

  •  #topsearch{ 
     text-align:center; 
      
     } 
    用这个上面的就可以了,很简单为我都想不到。哈哈哈谢谢谢谢谢


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
     <style type="text/css"> 
     #toplogo{ 
     float:left; 
      
     } 
     #topsearch{ 
     text-align:center; 
      
     } 
      
    </style>
    </head>

    <body>
    <div id="header">
    //里面两个div:1.toplogo 2.topsearch
    <div id="toplogo">
    <a href="http://www.chemgogo.com" target="_self">
    <img src="http://www.chemgogo.com/image/logosmall.gif" title="全球化学品供求网" alt="chemgogo" /></a>
    </div>

    <div id="topsearch">
    <form action="http://www.chemgogo.com/show.aspx" method="post" name="qname" target="_blank" id="form2">
    <input name="qname" title="输入查询化学品中、英文名、CAS号"
    style="width: 212px" />
    <input type="submit" name="chemgogo" value="chemgogo"/>
    </form>
    </div>

    </div>

    </body>
    </html>

    • 已标记为答案 wanguan2000 2009年11月25日 7:30
    2009年11月25日 7:30

全部回复

  • 为了方便看到效果,添加了一个边框,

    <div id="header" style='text-align:center'>
    <div id="toplogo" style='position:absolute;'>
    <a href="http://www.chemgogo.com" target="_self">
    <img src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" title="全球化学品供求网" alt="chemgogo" /></a>
    </div>
    <div id="topsearch" style='border:1px solid red;position:relative'>
    <form action="http://www.chemgogo.com/show.aspx" method="post" name="qname" target="_blank" id="form2">
    <input name="qname" title="输入查询化学品中、英文名、CAS号" 
    style="width: 212px" />
    <input type="submit" name="chemgogo" value="chemgogo"/>
    </form>
    </div>
    </div>


    【孟子E章】
    2009年11月25日 6:53
    版主
  • 十分感谢,我的firefox是可以的。但是ie6不可以。图片也在中间叠在一起了。
    谢谢您的回复。有没有兼容ie6的?
    2009年11月25日 7:18
  •  #topsearch{ 
     text-align:center; 
      
     } 
    用这个上面的就可以了,很简单为我都想不到。哈哈哈谢谢谢谢谢


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
     <style type="text/css"> 
     #toplogo{ 
     float:left; 
      
     } 
     #topsearch{ 
     text-align:center; 
      
     } 
      
    </style>
    </head>

    <body>
    <div id="header">
    //里面两个div:1.toplogo 2.topsearch
    <div id="toplogo">
    <a href="http://www.chemgogo.com" target="_self">
    <img src="http://www.chemgogo.com/image/logosmall.gif" title="全球化学品供求网" alt="chemgogo" /></a>
    </div>

    <div id="topsearch">
    <form action="http://www.chemgogo.com/show.aspx" method="post" name="qname" target="_blank" id="form2">
    <input name="qname" title="输入查询化学品中、英文名、CAS号"
    style="width: 212px" />
    <input type="submit" name="chemgogo" value="chemgogo"/>
    </form>
    </div>

    </div>

    </body>
    </html>

    • 已标记为答案 wanguan2000 2009年11月25日 7:30
    2009年11月25日 7:30