zoukankan      html  css  js  c++  java
  • css两个form不换行,两个div并排代码

    1.form不换行通过table布局实现

    <table>
     <tr>
      <td>
       <form method="get" action="left.cgi" name="WEBCAM-TEST"><input type=image src="images/left.jpg"/></form>
      </td>
      <td>
       <form method="get" action="pause.cgi" name="WEBCAM-TEST"><input type=image src="images/pause.jpg" /></form>
      </td>
     </tr>
    </table>

    2.form不换行通过css实现

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style type="text/css">
    form{margin:0px; display:inline}
    </style>
    </head>
    
    <body>
    <form id="form1" name="form1" method="post" action="">
      <label>aaa
      <input type="text" name="textfield" />
      </label>
    </form>
    <form id="form2" name="form2" method="post" action="">
      <label>
      <input type="checkbox" name="checkbox" value="checkbox" />
      aaa</label>
    </form>
    </body>
    </html>

    form{margin:0px; display:inline}

    3.两个div并排

    <!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>css两个div并排</title>
    <style type="text/css">
    <!--
    .onediv{width:90px; height:50px;float:left;margin:0 0 0 5px; border:1px #000 solid; background:#FF0000}
    .twodiv{width:90px; height:50px;float:left;margin:0 0 0 5px; border:1px #000 solid; background:#99CC00}
    -->
    </style>
    </head> 
    <body><div class="onediv"></div><div class="twodiv"></div> 
    </body>
    </html>
  • 相关阅读:
    HTML 列表中的dl,dt,dd,ul,li,ol区别及应用
    JS中关于clientWidth offsetWidth scrollWidth 等的含义
    关于javascript中dataset的问题小结
    AMD CMD ,requirejs seajs 区别
    [if IE ]>与<![endif]
    windows下实现wamp与tomcat环境整合
    webstorm 设置jsp支持
    js获取客户端IP及地理位置
    AngularJS所有版本下载地址
    jQuery插件开发全解析
  • 原文地址:https://www.cnblogs.com/simpledev/p/3956915.html
Copyright © 2011-2022 走看看