删除表格单元格上用于嵌套表格的空间

雷纳拉萨

我正在尝试做一个嵌套表,table当发生这种情况时,我将在我的第一个表上完成它:

党卫军

这是我的HTML标记:

   <table class="quotationTable1">
    <%--Primary table--%>
    <tr>
        <td>
            <table>
                <%--Second Table--%>
                <tr>
                    <td style="width: 397px">
                        <table style="border-style: solid; border-color: inherit; border-width: medium; width: 452px;">
                            <%--Third Table--%>
                            <tr>
                                <th colspan="2" style="padding-top: 5px; background-color: black; color: white;">Job Quotation</th>
                            </tr>
                            <tr>
                                <td colspan="2" style="height: 26px;">
                                    <asp:Label ID="lblDescCategory" runat="server" Text="Category:"></asp:Label>
                                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:Label ID="labelDescType" runat="server" Text="Type:"></asp:Label>
                                    <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td style="width: 265px">
                                    <asp:Label ID="lblDescAddress" runat="server" Text="Address:"></asp:Label>
                                    <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                                </td>
                                </tr>
                                <tr>
                                <td style="width: 202px">
                                    <asp:Label ID="lblDescContacts" runat="server" Text="Contacts:"></asp:Label>
                                    <asp:Label ID="Label4" runat="server" Text="Label"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2" style="height: 3px">
                                    <asp:Label ID="lblDescJobdesc" runat="server" Text="Job Description:"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2" style="height: 59px">
                                    <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:Label ID="Label5" runat="server" Text="File: "></asp:Label>
                                    <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>
                                </td>
                            </tr>
                            <tr>
                                <td colspan="2">
                                    <asp:Label ID="Label7" runat="server" Text="Finishing:"></asp:Label></td>
                            </tr>
                        </table>
                    </td>
                    <td>
                        <table style="width: 373px; position:relative;"><%--fourth table--%>
                            <tr>
                                   <th colspan="3" style="padding-bottom:5px; background-color: black; color: white; width: 400px;">Specification</th>
                            </tr>    
                        </table>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

我怎样才能使我的第二个table 规范删除所有这些空格并与工作报价位于同一位置

迪帕斯

您需要添加vertical-align:toptd

并且不要使用内联样式,而是使用类

td {
  vertical-align: top
}
.w400 {
  padding-bottom: 5px;
  background-color: black;
  color: white;
  width: 400px
}
.w397 {
  width: 397px
}
.w397 table {
  border-style: solid;
  border-color: inherit;
  border-width: medium;
  width: 452px
}
.w397.title {
  padding-top: 5px;
  background-color: black;
  color: white;
}
.w373.relative {
  width: 373px;
  position: relative
}
.h59 {
  height: 59px
}
.h26 {
  height: 26px
}
.h3 {
  height: 3px
}
<table class="quotationTable1">
  <tr>
    <td>
      <table>
        <tr>
          <td class="w397">
            <table class="w397 table">
              <tr>
                <th colspan="2" class="w397 title">Job Quotation</th>
              </tr>
              <tr>
                <td colspan="2" class="w397 h26">
                  <asp:Label ID="lblDescCategory" runat="server" Text="Category:"></asp:Label>
                  <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <asp:Label ID="labelDescType" runat="server" Text="Type:"></asp:Label>
                  <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
                </td>
              </tr>
              <tr>
                <td class="w265">
                  <asp:Label ID="lblDescAddress" runat="server" Text="Address:"></asp:Label>
                  <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                </td>
              </tr>
              <tr>
                <td class="w202">
                  <asp:Label ID="lblDescContacts" runat="server" Text="Contacts:"></asp:Label>
                  <asp:Label ID="Label4" runat="server" Text="Label"></asp:Label>
                </td>
              </tr>
              <tr>
                <td colspan="2" class="h3">
                  <asp:Label ID="lblDescJobdesc" runat="server" Text="Job Description:"></asp:Label>
                </td>
              </tr>
              <tr>
                <td colspan="2" class="h59">
                  <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <asp:Label ID="Label5" runat="server" Text="File: "></asp:Label>
                  <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>
                </td>
              </tr>
              <tr>
                <td colspan="2">
                  <asp:Label ID="Label7" runat="server" Text="Finishing:"></asp:Label>
                </td>
              </tr>
            </table>
          </td>
          <td>
            <table class="w373 relative">
              <tr>
                <th colspan="3" class="w400">Specification</th>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

删除表格中按钮单元格之间的空间

来自分类Dev

如何删除表格单元格中的空白空间?

来自分类Dev

在嵌套元素上显示表格单元格?

来自分类Dev

在嵌套元素上显示表格单元格?

来自分类Dev

删除表格单元格末尾的空白

来自分类Dev

删除表格单元格之间的空白

来自分类Dev

单击表格单元格上的功能

来自分类Dev

如何删除垂直旋转文本上方html表格单元格内的空间

来自分类Dev

如何删除垂直旋转文本上方html表格单元格内的空间

来自分类Dev

仅在表格单元格之间设置空间

来自分类Dev

CSS表格单元格填充了firefox中的剩余空间

来自分类Dev

表格单元格> img额外4px空间

来自分类Dev

表格单元格之间没有边界的空间

来自分类Dev

使用嵌套表格单元格时的怪异行为

来自分类Dev

在表格单元格中对齐表格

来自分类Dev

在表格单元格中对齐表格

来自分类Dev

表格单元格的间距

来自分类Dev

表格单元格的宽度(%)

来自分类Dev

如何删除Google表格中选定单元格上的网格线?

来自分类Dev

Google表格-用于填充单元格IF列的脚本

来自分类Dev

用于填写表格html单元格的Javascript

来自分类Dev

宽度不适用于表格单元格

来自分类Dev

用于在表格中添加单元格的 Javascript

来自分类Dev

删除HTML表格单元格的顶部边框

来自分类Dev

删除Google表格单元格中的HTML

来自分类Dev

如何删除表格中单元格的边框?

来自分类Dev

如何从表格中删除单元格标签?

来自分类Dev

从Google表格的单元格中删除“和= +

来自分类Dev

在一个单元格中删除表格背景