去掉form的高度 --table中有form,td的高度直接被撑高了,去掉form的高度就好了

项目中遇到的问题,页面点击提交时,总是要点击两下,先以为是页面焦点的问题,在页面提交按钮获取了焦点,但是问题还是没解决。最后终于找到问题原因了,原来是form表单的高度比编辑的高度高出一截。于是在网上搜查了一番,没想到还真有解决办法。

一个form中嵌套table时,form的高度老是比编辑的高度高出一截,将td撑得老高,造成了form下面一段空白,很难看。

我们在做网页时,当要插入表单于表格中时往往会出现表格的高度变大,并不是我们想要的效果,这类问题出现的原因是<form>标签出现在了<table>的前面,如下:

  1. <form> 
  2.    <table> 
  3.       <tr> 
  4.         <td> 
  5.         </td> 
  6.       </tr> 
  7.    </table> 
  8. </form> 
<form>
   <table>
      <tr>
        <td>
        </td>
      </tr>
   </table>
</form>


解决的方法很简单:即将<form>放在<table>与<tr>之间,如下:

  1. <table> 
  2.   <form> 
<table>
  <form>
  1.     <tr> 
  2.       <td> 
  3.       </td> 
  4.     </tr> 
  5. </form> 
      <tr>
        <td>
        </td>
      </tr>
  </form>
  1. </table> 
</table>

问题是解决了,但同时也带来其它的问题.那就是当我们用MS的Webdesigner之类的工具再次打开这页面时,提示标签错误,这类软件要求<form>标签要放在<table>的外面...

放在外面就会出现高度增加的情况,反正IE和FF都能正常解释,所以不用管了,就放在里面好了.

不过,这不代表问题从根本上得到解决,毕竟这样的代码是通过不了验证的,也就是说不是符合标准的,当w3c不让我们用table来排版的时候,就需要用其它的方法.让我们来看看从根本上解决问题的方法:

解决办法:

直接在form中写<form style='padding:0px;margin:0px;'>

或者:

  1. <style>  
  2. form{margin: 0}  
  3. </style> 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值