我一直在为我的朋友们开设一个网站,但我遇到了一个问题。 他们要求让顶部的旗帜更宽,这就是我所做的,并且它引起了这一点。
http://i.imgur.com/yHzscsB.png
这里的代码是导航栏部分,我真的想要修复这部分,因为我觉得我可以弄清楚剩下的就好了。
<table width="1400" border="0" height="100%" cellpadding="0" cellspacing="0">
<tr>
<td height="203" colspan="11" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="58" height="184" valign="top"><img src="images/en_02.gif" width="58" height="184" /></td>
<td colspan="3" valign="top"><img src="images/banner.png" width="1400" height="184" /></td>
<td width="58" valign="top"><img src="images/en_04.gif" width="58" height="184" /></td>
</tr>
<tr>
<td height="19" valign="top"><img src="images/en_06.gif" width="58" height="19" /></td>
<td width="500" valign="top"><img src="images/glow_ban.png" width="500" height="19" /></td><td width="800" align ="left" valign="top"><a href="http://www.uafclan.com">
<img src="images/main.png" width="125" height="19" border="0"/></a><a href="http://www.uafclan.com/forums"><img src="images/forums.png" width="124" height="19" border="0"/></a><a href="http://www.uafclan.com/join"><img src="images/joins.png"width="125" height="19" border="0" /></a><a href="http://www.uafclan.com/member"><img src="images/member.png" width="125" height="19" border="0"/></a><a href="http://www.uafclan.com/staff"><img src="images/staff.png" width="125" height="19" border="0" /></a><a href="http://www.uafclan.com/rosters"><img src="images/rosters.png" width="125" height="19" border="0"/></a><td width="72" valign="top"><img src="images/right_glow.png"height="19" /></td>
<td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
</tr>
</table> </td>
</tr>
答案 0 :(得分:0)
有一个未公开的 td 标记。尝试使用此代码块代替您的代码:
<table width="1400" border="0" height="100%" cellpadding="0" cellspacing="0">
<tr>
<td height="203" colspan="11" valign="top">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="58" height="184" valign="top"><img src="images/en_02.gif" width="58" height="184" /></td>
<td colspan="3" valign="top"><img src="images/banner.png" width="1400" height="184" /></td>
<td width="58" valign="top"><img src="images/en_04.gif" width="58" height="184" /></td>
</tr>
<tr>
<td height="19" valign="top"><img src="images/en_06.gif" width="58" height="19" /></td>
<td width="500" valign="top"><img src="images/glow_ban.png" width="500" height="19" /></td>
<td width="800" align ="left" valign="top"><a href="http://www.uafclan.com"><img src="images/main.png" width="125" height="19" border="0"/></a><a href="http://www.uafclan.com/forums"><img src="images/forums.png" width="124" height="19" border="0"/></a><a href="http://www.uafclan.com/join"><img src="images/joins.png"width="125" height="19" border="0" /></a><a href="http://www.uafclan.com/member"><img src="images/member.png" width="125" height="19" border="0"/></a><a href="http://www.uafclan.com/staff"><img src="images/staff.png" width="125" height="19" border="0" /></a><a href="http://www.uafclan.com/rosters"><img src="images/rosters.png" width="125" height="19" border="0"/></a></td>
<td width="72" valign="top"><img src="images/right_glow.png"height="19" /></td>
<td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
</tr>
</table>
</td>
</tr>
答案 1 :(得分:0)
这是你的代码缩进,可能更容易阅读。你的'容器'表的宽度设置为1400.内表的第一行中的宽度总和加起来为1516,第二行的加权数为1437.我想知道是否有额外的宽度会使事情变形。
<table width="1400" border="0" height="100%" cellpadding="0" cellspacing="0">
<tr>
<td height="203" colspan="11" valign="top">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="58" height="184" valign="top">
<img src="images/en_02.gif" width="58" height="184" />
</td>
<td colspan="3" valign="top">
<img src="images/banner.png" width="1400" height="184" />
</td>
<td width="58" valign="top">
<img src="images/en_04.gif" width="58" height="184" />
</td>
</tr>
<tr>
<td height="19" valign="top">
<img src="images/en_06.gif" width="58" height="19" />
</td>
<td width="500" valign="top">
<img src="images/glow_ban.png" width="500" height="19" />
</td>
<td width="800" align ="left" valign="top">
<a href="http://www.uafclan.com">
<img src="images/main.png" width="125" height="19" border="0"/>
</a>
<a href="http://www.uafclan.com/forums">
<img src="images/forums.png" width="124" height="19" border="0"/>
</a>
<a href="http://www.uafclan.com/join">
<img src="images/joins.png"width="125" height="19" border="0" />
</a>
<a href="http://www.uafclan.com/member">
<img src="images/member.png" width="125" height="19" border="0"/>
</a>
<a href="http://www.uafclan.com/staff">
<img src="images/staff.png" width="125" height="19" border="0" />
</a>
<a href="http://www.uafclan.com/rosters">
<img src="images/rosters.png" width="125" height="19" border="0"/>
</a>
</td>
<td width="72" valign="top">
<img src="images/right_glow.png"height="19" />
</td>
<td valign="top">
<img src="images/en_17.gif" width="58" height="19" />
</td>
</tr>
</table>
</td>
</tr>
答案 2 :(得分:0)
我认为这些代码块导致了问题:
<td width="72" valign="top"><img src="images/right_glow.png"height="19" /></td>
<td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
我无法让它完美运行,但我认为我改善了这种情况(我不完全确定你想要的最终结果是什么,但我认为只是将它全部排成一行):
<td valign="top" width="125">
<img src="images/right_glow.png" width="125" height="19" />
</td>
<td valign="top" width="58">
<img src="images/en_17.gif" width="58" height="19" />
您可以在此处查看结果:http://jsfiddle.net/gratiafide/3o26Lwhf/ 尝试剪切并粘贴原始代码以查看差异。祝你好运!