style="border-collapse:collapse"的疑问解决思路
日期：2014-05-17 浏览次数：20956 次
style="border-collapse:collapse"的疑问
border-collapse的实现，在ie和firefox下效果并不相同。
在ie下，border-collapse只是将table里，与table的四个外边框相接的 td的相接的部分的边框 去掉了。其它的td的边框，不变，不会合并。
在firefox下，border-collapse将所有的td间的cellspacing去掉了，也就是说，有border-collapse，有cellspacing时，cellspacing是没有用的，都相当于0。这就是所谓的边框合并。
是这样的吧？感觉弄得有点晕了
使用下面的表格来测试：
<table width="300" style="border-collapse:collapse" border="10" cellpadding="0" cellspacing="20" bordercolor="#FF0000" >
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
</table>
------解决方案--------------------
在页面前面加
<!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">
即可实现浏览器的统一
border-collapse的实现，在ie和firefox下效果并不相同。
在ie下，border-collapse只是将table里，与table的四个外边框相接的 td的相接的部分的边框 去掉了。其它的td的边框，不变，不会合并。
在firefox下，border-collapse将所有的td间的cellspacing去掉了，也就是说，有border-collapse，有cellspacing时，cellspacing是没有用的，都相当于0。这就是所谓的边框合并。
是这样的吧？感觉弄得有点晕了
使用下面的表格来测试：
<table width="300" style="border-collapse:collapse" border="10" cellpadding="0" cellspacing="20" bordercolor="#FF0000" >
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
<tr>
<td>abc</td>
<td>abc</td>
<td>abc</td>
<td>abc</td>
</tr>
</table>
------解决方案--------------------
在页面前面加
<!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">
即可实现浏览器的统一
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
