html - 表 td 宽度未被拾取

标签 html css

我正在处理 html 签名,但未选择 td 宽度,这里是结构必须如何的示例。它是黄色条,我在设置宽度时遇到了困难。

enter image description here

<table width="480" cellspacing="0" cellpadding="0" border="0" bgcolor="#ffffff" style="display: inline-table;">
  <tbody>
    <tr>
      <td width="5" height="1"></td>
      <td width="9" height="1"></td>
      <td width="182" height="1"></td>
      <td width="57" height="1"></td>
      <td width="30" height="1"></td>
      <td width="98" height="1"></td>
      <td width="37" height="1"></td>
      <td width="37" height="1"></td>
      <td width="37" height="1"></td>
      <td width="37" height="1"></td>
      <td width="37" height="1"></td>
      <td width="9" height="1"></td>
      <td width="5" height="1"></td>
      <td width="1" height="1"></td>
    </tr>
    <tr>
      <td colspan="13">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Met vriendelijke groet,</span>
      </td>
      <td width="1" height="22"></td>
    </tr>
    <tr>
      <td width="570" height="13" colspan="13"></td>
      <td width="1" height="13"></td>
    </tr>
    <tr>
      <td width="248" height="10" colspan="3" style="vertical-align: bottom;">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">
					<strong>Jaap Jacobs</strong>
				</span>
      </td>
      <td width="30" height="66" rowspan="3" colspan="2"></td>
      <td width="292" height="22" colspan="7" style="vertical-align: bottom;">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">Phone Number</span>
      </td>
      <td width="1" height="22"></td>
    </tr>
    <tr>
      <td width="248" height="22" colspan="3">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Managing director</span>
      </td>
      <td width="292" height="22" colspan="7">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
				<a style="color: #222222; text-decoration: none;" href="http://www.fingerspitz.nl">www.fingerspitz.nl</a>
			</span>
      </td>
      <td width="1" height="22"></td>
    </tr>
    <tr>
      <td width="248" height="22" colspan="3" style="vertical-align: top;">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
					<a style="color: #222222; text-decoration: none;" href="mailto:emailtest@email.nl">emailtest@email.nl</a>
				</span>
      </td>
      <td width="292" height="22" colspan="7" style="vertical-align: top;">
        <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
					Reduitlaan 29, 4814 DC, Breda
				</span>
      </td>
      <td width="1" height="22"></td>
    </tr>
    <tr>
      <td width="570" height="23" colspan="11"></td>
      <td width="1" height="23"></td>
    </tr>
    <tr bgcolor="#ffd668">
      <td width="14" height="50" colspan="2" rowspan="3" style="border-radius: 15px 0 0 15px;"></td>
      <td width="552" height="10" colspan="9"></td>
      <td width="14" height="50" colspan="2" rowspan="3" style="border-radius: 0 15px 15px 0;"></td>
    </tr>
    <tr bgcolor="#ffd668">
      <td width="128" height="30" align="center" style="line-height: 0" colspan="2">
        <a style="border: 0;" href="http://www.fingerspitz.nl">
          <img width="128" height="22" alt="Fingerspitz" src="https://www.fingerspitz.nl/files/Social_iconen/Fingerspitz_logo.png">
        </a>
      </td>
      <td width="37" height="30" align="right"></td>
      <td width="37" height="30" align="left">
        <a style="border: none; display: block; width: 30px;" href="http://www.facebook.com/Fingerspitz">
          <img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Facebook.png">
        </a>
      </td>
      <td width="37" height="30" align="right">
        <a style="border: none; display: block; width: 30px;" href="https://twitter.com/fingerspitzNL/">
          <img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Twitter.png">
        </a>
      </td>
      <td width="37" height="30" align="right">
        <a style="border: none; display: block; width: 30px;" href="http://www.linkedin.com/company/fingerspitz">
          <img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/LinkedIn.png">
        </a>
      </td>
      <td width="37" height="30" align="right">
        <a style="border: none; display: block; width: 30px;" href="https://www.youtube.com/channel/UCpovXRL4rEF8skjhle2z25Q">
          <img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/YouTube.png">
        </a>
      </td>
      <td width="1" height="30"></td>
      <td width="37" height="30" align="right">
        <a style="border: none; display: block; width: 30px;" href="https://www.youtube.com/channel/UCpovXRL4rEF8skjhle2z25Q">
          <img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Maps.png">
        </a>
      </td>
    </tr>
    <tr bgcolor="#ffd668">
      <td width="552" height="10" colspan="9"></td>
    </tr>
    <tr>
      <td colspan="14">
        <table>
          <tbody>
            <tr>
              <td width="30" height="50">
                <a href="https://www.fingerspitz.nl/blog/434-fingerspitz-1-tradingdesks-volgens-onderzoek-emerce-100">
                  <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;"><img width="40" height="40" alt="Dutch Search Awards" src="https://www.fingerspitz.nl/files/Social_iconen/Emerce_100_2.png"></span>
                </a>
              </td>
              <td width="10" height="30"></td>
              <td width="512" height="50">
                <span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;"><b>Fingerspitz is #1 Tradingdesk van Nederland volgens Emerce!<br><a href="https://www.fingerspitz.nl/blog/434-fingerspitz-1-tradingdesks-volgens-onderzoek-emerce-100">Lees meer</a>!</b></span>
              </td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>

我希望有人能解释我并帮助我解决这个问题..

最佳答案

你需要调整好 td 的编号,在这种情况下你需要非常仔细地使用 colspan。虽然我已经更新了你的黄色栏。请确保更新黄色条下方行的代码。希望对您有所帮助。

<table width="480" cellspacing="0" cellpadding="0" border="0" bgcolor="#ffffff" style="display: inline-table;">
	<tbody>
	<tr>
		<td width="5" height="1"></td>
		<td width="9" height="1"></td>
		<td width="182" height="1"></td>
		<td width="57" height="1"></td>
		<td width="30" height="1"></td>
		<td width="98" height="1"></td>
		<td width="37" height="1"></td>
		<td width="37" height="1"></td>
		<td width="37" height="1"></td>
		<td width="37" height="1"></td>
		<td width="37" height="1"></td>
		<td width="9" height="1"></td>
		<td width="5" height="1"></td>
		<td width="1" height="1"></td>
	</tr>
	<tr>
		<td colspan="13">
			<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Met vriendelijke groet,</span>
		</td>
		<td width="1" height="22"></td>
	</tr>
	<tr>
		<td width="570" height="13" colspan="13"></td>
		<td width="1" height="13"></td>
	</tr>
	<tr>
		<td width="248" height="10" colspan="3" style="vertical-align: bottom;">
				<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">
					<strong>Jaap Jacobs</strong>
				</span>
		</td>
		<td width="30" height="66" rowspan="3" colspan="2"></td>
		<td width="292" height="22" colspan="7" style="vertical-align: bottom;">
			<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;">Phone Number</span>
		</td>
		<td width="1" height="22"></td>
	</tr>
	<tr>
		<td width="248" height="22" colspan="3">
			<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">Managing director</span>
		</td>
		<td width="292" height="22" colspan="7">
			<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
				<a style="color: #222222; text-decoration: none;" href="http://www.fingerspitz.nl">www.fingerspitz.nl</a>
			</span>
		</td>
		<td width="1" height="22"></td>
	</tr>
	<tr>
		<td width="248" height="22" colspan="3" style="vertical-align: top;">
				<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
					<a style="color: #222222; text-decoration: none;" href="mailto:emailtest@email.nl">emailtest@email.nl</a>
				</span>
		</td>
		<td width="292" height="22" colspan="7" style="vertical-align: top;">
				<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;">
					Reduitlaan 29, 4814 DC, Breda
				</span>
		</td>
		<td width="1" height="22"></td>
	</tr>
	<tr>
		<td width="570" height="23" colspan="11"></td>
		<td width="1" height="23"></td>
	</tr>
	<tr bgcolor="#ffd668">
		<td width="14" height="50" colspan="2" rowspan="3" style="border-radius: 15px 0 0 15px;"></td>
		<td width="552" height="10" colspan="9"></td>
		<td width="14" height="50" colspan="2" rowspan="3" style="border-radius: 0 15px 15px 0;"></td>
	</tr>
	<tr bgcolor="#ffd668">
    <td colspan="12">
    <table>
     <tr>
        <td width="128" height="30" align="center" style="line-height: 0" colspan="2">
        <a style="border: 0;" href="http://www.fingerspitz.nl">
          <img width="128" height="22" alt="Fingerspitz" src="https://www.fingerspitz.nl/files/Social_iconen/Fingerspitz_logo.png">
        </a>
      </td>
      
        <td width="352" align="right">
          <table style="width:100%;">
            <tr>
                <td width="100" height="30"></td>
		<td width="37" height="30">
			<a style="border: none; display: block; width: 30px;" href="http://www.facebook.com/Fingerspitz">
				<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Facebook.png"/>
			</a>
		</td>
		<td width="37" height="30">
			<a style="border: none; display: block; width: 30px;" href="https://twitter.com/fingerspitzNL/">
				<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Twitter.png" />
			</a>
		</td>
		<td width="37" height="30">
			<a style="border: none; display: block; width: 30px;" href="http://www.linkedin.com/company/fingerspitz">
				<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/LinkedIn.png" />
			</a>
		</td>
		<td width="37" height="30">
			<a style="border: none; display: block; width: 30px;" href="https://www.youtube.com/channel/UCpovXRL4rEF8skjhle2z25Q">
				<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/YouTube.png" />
			</a>
		</td>
		<td width="1" height="30"></td>
		<td width="37" height="30">
			<a style="border: none; display: block; width: 30px;" href="https://www.youtube.com/channel/UCpovXRL4rEF8skjhle2z25Q">
				<img width="30" height="30" src="https://www.fingerspitz.nl/files/Social_iconen/Maps.png" />
			</a>
		</td>
            </tr>
          </table>
            
        </td>
     </tr>
		
		
    </table>
    </td>
	</tr>
	<tr bgcolor="#ffd668">
		<td width="552" height="10" colspan="9"></td>
	</tr>
	<tr>
		<td colspan="14">
			<table>
				<tbody><tr>
					<td width="30" height="50">
						<a href="https://www.fingerspitz.nl/blog/434-fingerspitz-1-tradingdesks-volgens-onderzoek-emerce-100">
							<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 13px;"><img width="40" height="40" alt="Dutch Search Awards" src="https://www.fingerspitz.nl/files/Social_iconen/Emerce_100_2.png"></span>
						</a>
					</td>
					<td width="10" height="30"></td>
					<td width="512" height="50">
						<span style="color: #222222; font-family: Lucida Grande,Arial,Helvetica,sans-serif; font-size: 12px;"><b>Fingerspitz is #1 Tradingdesk van Nederland volgens Emerce!<br><a href="https://www.fingerspitz.nl/blog/434-fingerspitz-1-tradingdesks-volgens-onderzoek-emerce-100">Lees meer</a>!</b></span>
					</td>
				</tr>
			</tbody></table>
		</td>
	</tr>
	</tbody>
</table>

关于html - 表 td 宽度未被拾取,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46401180/

相关文章:

javascript - 如何从DataTables中选定的数据中获取数据

javascript - 更改创建的多选下拉复选框的样式和位置

javascript - 表单中的命名元素如何干扰全局命名空间?

javascript - html 脚本 src =""使用按钮触发重定向

html - 背景图像和位置相对白色边框

javascript - 如何检测设备是否有振动器?

css - 在最小图像之后调整行

javascript - 在 JavaScript 中处理 HTML 颜色和透明度

javascript - Aurelia JS - Kendo UI 垂直 slider 的高度百分比?

javascript - 无法清除 float :left