gpt4 book ai didi

html - 子表的 CSS 表格单元格宽度

转载 作者:行者123 更新时间:2023-11-28 15:27:39 26 4
gpt4 key购买 nike

我有嵌套表格:

#progressHeading thead td.spacingCol {
border: 2px solid #ffffff;
background-color: #ffffff;
}

.collapseProcess {
background: url(../images/minus.png) no-repeat 4px 4px;
cursor: pointer;
float: left;
width: 25px;
}

.expandProcess {
background: url(../images/plus.png) no-repeat 4px 4px;
cursor: pointer;
float: left;
width: 25px;
}

#progressHeading {
table-layout: fixed;
width: auto;
}

#progressHeading thead td {
border: 2px solid #000000;
background-color: #B8CCE4;
text-align: center;
height: 35px;
}

#progressHeading td.startDayCol {
border-right: 1px solid #000000;
margin-left: 5px;
}

#progressHeading td.endDayCol {
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

#progressHeading td.totalDaysCol {
border-left: 1px solid #000000;
}

thead {
font-weight: bold;
}

.processCol {
width: 300px;
}

.startDayCol,
.endDayCol,
.totalDaysCol {
width: 100px;
}

.statusCol {
width: 125px
}

table tr td.spacingCol,
table .phaseRow td.spacingCol,
#progressHeading thead td.spacingCol {
background: #ffffff;
width: 5px;
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-top: 2px solid #FFFFFF;
border-bottom: 2px solid #FFFFFF;
}

table tr td:nth-child(9) {
border-right: 2px solid #000000;
}

table tr td:nth-child(5),
table tr td:nth-child(6) {
border-right: 1px solid #000000;
}

table tr td:nth-child(1) {
border-left: 2px solid #000000;
}

table thead td,
table .phaseRow td {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
}

#floatDays tbody td {
border-bottom: 2px solid #000000;
}

table {
table-layout: fixed;
width: 100%;
border-collapse: collapse;
border-spacing: 0px;
empty-cells: hide;
}

#progressHeading thead td #calendarDisplay td {
width: 100px;
border-right: 1px solid #000000;
}

#progressHeading thead td #dailyDisplay td {
background-color: #DCE6F1;
font-weight: normal;
height: 15px;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
}

#progressHeading thead td .dailyDisplayRow td {
height: 12px !important;
}

table td div {
background-color: #B8CCE4;
color: #B8CCE4;
}

.dayWidth {
float: left;
width: 20px;
color: #000000;
background-color: #DCE6F1;
font-weight: normal;
}
<table>
<table id="progressHeading" style="display: table;">
<thead>
<tr>
<td class="processCol">Process</td>
<td class="spacingCol"></td>
<td class="statusCol">Status</td>
<td class="spacingCol"></td>
<td class="startDayCol">Start Day</td>
<td class="endDayCol">End Day</td>
<td class="totalDaysCol">Total Days</td>
<td class="spacingCol"></td>
<td class="calendarCol">
<table>
<tbody>
<tr class="dailyDisplayRow">
<td>Week of <br>Jun 05</td>
<td>Week of <br>Jun 12</td>
<td>Week of <br>Jun 19</td>
<td>Week of <br>Jun 26</td>
<td>Week of <br>Jul 03</td>
<td>Week of <br>Jul 10</td>
<td>Week of <br>Jul 17</td>
<td>Week of <br>Jul 24</td>
<td>Week of <br>Jul 31</td>
<td>Week of <br>Aug 07</td>
<td>Week of <br>Aug 14</td>
<td>Week of <br>Aug 21</td>
<td>Week of <br>Aug 28</td>
<td>Week of <br>Sep 04</td>
<td>Week of <br>Sep 11</td>
<td>Week of <br>Sep 18</td>
<td>Week of <br>Sep 25</td>
<td>Week of <br>Oct 02</td>
<td>Week of <br>Oct 09</td>
<td>Week of <br>Oct 16</td>
<td>Week of <br>Oct 23</td>
<td>Week of <br>Oct 30</td>
<td>Week of <br>Nov 06</td>
<td>Week of <br>Nov 13</td>
<td>Week of <br>Nov 20</td>
<td>Week of <br>Nov 27</td>
<td>Week of <br>Dec 04</td>
<td>Week of <br>Dec 11</td>
<td>Week of <br>Dec 18</td>
<td>Week of <br>Dec 25</td>
<td>Week of <br>Jan 01</td>
<td>Week of <br>Jan 08</td>
</tr>
<tr class="dailyDisplayRow" id="ctl00_ctl40_g_ce153c5a_4a3a_4dc9_9b78_f4877028ebbd_dailyDisplay">
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</thead>
<tbody>
<tr>
<td colspan="9"></td>
</tr>
</tbody>
</table>

每个初始表格单元格都有一组(table-layout: fixed, width: 100%),一切看起来都很棒。问题出在最后一个单元格中。我想扩大宽度,以便单元格扩大以适合其中的表格。即使我用 jQuery 将 width 设置为内容的 width,它也不起作用。如果我删除表格布局和 width,其他单元格将不会获得它们应有的宽度。我不想更改表格的 overflow,因此您正在 x 滚动表格的宽度,我希望保持这样,以便在页面上进行水平滚动。我只想让父表的边框延伸到子表的宽度。

最佳答案

从表中删除 width: 100% 并将 min-width 而不是 width 给每个单独的 td .

#progressHeading thead td.spacingCol {
border: 2px solid #ffffff;
background-color: #ffffff;
}

.collapseProcess {
background: url(../images/minus.png) no-repeat 4px 4px;
cursor: pointer;
float: left;
width: 25px;
}

.expandProcess {
background: url(../images/plus.png) no-repeat 4px 4px;
cursor: pointer;
float: left;
width: 25px;
}

#progressHeading {
table-layout: fixed;
width: auto;
}

#progressHeading thead td {
border: 2px solid #000000;
background-color: #B8CCE4;
text-align: center;
height: 35px;
}

#progressHeading td.startDayCol {
border-right: 1px solid #000000;
margin-left: 5px;
}

#progressHeading td.endDayCol {
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

#progressHeading td.totalDaysCol {
border-left: 1px solid #000000;
}

thead {
font-weight: bold;
}

.processCol {
min-width: 300px;
}

.startDayCol,
.endDayCol,
.totalDaysCol {
min-width: 100px;
}

.statusCol {
min-width: 125px
}

table tr td.spacingCol,
table .phaseRow td.spacingCol,
#progressHeading thead td.spacingCol {
background: #ffffff;
min-width: 5px;
border-left: 2px solid #000000;
border-right: 2px solid #000000;
border-top: 2px solid #FFFFFF;
border-bottom: 2px solid #FFFFFF;
}

table tr td:nth-child(9) {
border-right: 2px solid #000000;
}

table tr td:nth-child(5),
table tr td:nth-child(6) {
border-right: 1px solid #000000;
}

table tr td:nth-child(1) {
border-left: 2px solid #000000;
}

table thead td,
table .phaseRow td {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
}

#floatDays tbody td {
border-bottom: 2px solid #000000;
}

table {
table-layout: fixed;
border-collapse: collapse;
border-spacing: 0px;
empty-cells: hide;
}

#progressHeading thead td #calendarDisplay td {
width: 100px;
border-right: 1px solid #000000;
}

#progressHeading thead td #dailyDisplay td {
background-color: #DCE6F1;
font-weight: normal;
height: 15px;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
}

#progressHeading thead td .dailyDisplayRow td {
height: 12px !important;
}

table td div {
background-color: #B8CCE4;
color: #B8CCE4;
}

.dayWidth {
float: left;
width: 20px;
color: #000000;
background-color: #DCE6F1;
font-weight: normal;
}
<table>
<table id="progressHeading" style="display: table;">
<thead>
<tr>
<td class="processCol">Process</td>
<td class="spacingCol"></td>
<td class="statusCol">Status</td>
<td class="spacingCol"></td>
<td class="startDayCol">Start Day</td>
<td class="endDayCol">End Day</td>
<td class="totalDaysCol">Total Days</td>
<td class="spacingCol"></td>
<td class="calendarCol">
<table>
<tbody>
<tr class="dailyDisplayRow">
<td>Week of <br>Jun 05</td>
<td>Week of <br>Jun 12</td>
<td>Week of <br>Jun 19</td>
<td>Week of <br>Jun 26</td>
<td>Week of <br>Jul 03</td>
<td>Week of <br>Jul 10</td>
<td>Week of <br>Jul 17</td>
<td>Week of <br>Jul 24</td>
<td>Week of <br>Jul 31</td>
<td>Week of <br>Aug 07</td>
<td>Week of <br>Aug 14</td>
<td>Week of <br>Aug 21</td>
<td>Week of <br>Aug 28</td>
<td>Week of <br>Sep 04</td>
<td>Week of <br>Sep 11</td>
<td>Week of <br>Sep 18</td>
<td>Week of <br>Sep 25</td>
<td>Week of <br>Oct 02</td>
<td>Week of <br>Oct 09</td>
<td>Week of <br>Oct 16</td>
<td>Week of <br>Oct 23</td>
<td>Week of <br>Oct 30</td>
<td>Week of <br>Nov 06</td>
<td>Week of <br>Nov 13</td>
<td>Week of <br>Nov 20</td>
<td>Week of <br>Nov 27</td>
<td>Week of <br>Dec 04</td>
<td>Week of <br>Dec 11</td>
<td>Week of <br>Dec 18</td>
<td>Week of <br>Dec 25</td>
<td>Week of <br>Jan 01</td>
<td>Week of <br>Jan 08</td>
</tr>
<tr class="dailyDisplayRow" id="ctl00_ctl40_g_ce153c5a_4a3a_4dc9_9b78_f4877028ebbd_dailyDisplay">
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
<td>
<div class="weekClass">
<div class="dayWidth">
M
</div>
<div class="dayWidth">
T
</div>
<div class="dayWidth">
W
</div>
<div class="dayWidth">
Th
</div>
<div class="dayWidth">
F
</div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</thead>
<tbody>
<tr>
<td colspan="9"></td>
</tr>
</tbody>
</table>

关于html - 子表的 CSS 表格单元格宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45071620/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com