0
この質問は既にこのフォーラムに掲載されていますが、表の行要素。私はcolgroupとcolspanを使用してみましたが、それぞれの追加によって多くのエラーと警告が発生します。私が理解できないことは、私が見ることができる(4)と計数が確立していないことです。私は括弧内の4は4列を意味すると推測しています。私の研究では、w3.orgテーブル構造WDGを訪問し、Web開発&デザインファウンデーションテキスト第7版のコンサルティングに加えて、多数のYoutubeビデオを見ました。私が警告手段を理解していれば、これを修正することができました。だから私はここに来て助けに来ます。ここに私のコードです。私は提案や手がかりを感謝します。テーブル行は1列幅で、第1行目(4)で設定された数よりも小さい
<table class="first">
<caption>TV Programs I Watch Most</caption>
<thead>
<tr>
<th id="name">Network</th>
<th id="shows">Favoite Shows</th>
<th id="chan">Channel</th>
<th id="sche">Schedule</th>
</tr>
</thead>
<tbody>
<tr>
<td headers="name">AJAM</td>
<td headers="shows">Inside Story</td>
<td headers="chan">347</td>
<td headers="sche">M-F 8:30PM</td>
</tr>
<tr>
<td headers="name">BET</td>
<td headers="shows">Tyler Perry</td>
<td headers="chan">329</td>
<td headers="sche">M-F 1:00PM</td>
</tr>
<tr>
<td headers="name">MSNBC</td>
<td headers="shows">Rachel Maddow</td>
<td headers="chan">356</td>
<td headers="sche">M-F 9:00PM</td>
</tr>
<tr>
<td headers="name">LINK</td>
<td headers="shows">Democracy Now</td>
<td headers="chan">375</td>
<td headers="sche">M-F 9:00AM</td>
</tr>
<tr>
<td>
<table class="second">
<caption>Show Rankings</caption>
<tr>
<th rowspan="5">My Take</th>
<th id="show">show</th>
<th id="rank">rank</th>
</tr>
<tr>
<td headers="show">Inside Story</td><td rowspan="2" headers="rank">5</td>
</tr>
<tr>
<td headers="show">Rachel Maddow</td><!-- <td headers="rank"></td> -->
<tr>
<td headers="show">Democracy Now</td><td headers="rank">4</td>
</tr>
<tr>
<td headers="show">Tyler Perry</td><td headers="rank">3</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
私もCSSコードを含めるつもりです:
h1{
margin-bottom:0px;
}
h2{
font-size:1.5em;
margin:0px 0px;
}
nav{
margin-bottom:15px;
}
nav a{
color:#96e;
background-color:#cecece;
text-decoration:none;
padding-right:10px;
}
caption{
line-height:150%;
font-size:1.5em;
font-style:italic;
}
table.main{
border-spacing:3px;
}
table.main thead{
background-color:#96e;
color:#ffffff;
text-align:left;
}
table.main td{
background-color:#eaeaea;
color:#96e;
vertical-align:top;
}
table.first{
font-family: Times, "Times New Roman", Georgia, serif;
width:50%;
height:auto;
border-style:inset;
border-spacing:3px;
background-color:#cecece;
color:#808080;
text-align:left;
padding-bottom:5px;
}
table.second{
font-family:"Lucida Console", Courier, monospace;
width:300px;
border-spacing:2px;
background-color:#c0c0c0;
color:#808080;
border:1px dashed #eaeaea;
text-align:left;
padding:5px;
}
table.second th{
background-color:#96e;
color:#ffffff;
text-align:center;
}
table.second td{
background-color:#eaeaea;
color:#000000;
text-align:center;
vertical-align:middle;
}
table a{
text-decoration:none;
}
#rank{
color:#00bfff;
}
#show{
color:#00bfff;
}
#name{
color:#00bfff;
}
#shows{
color:#00bfff;
}
#chan{
color:#00bfff;
}
#sche{
color:#00bfff;
}
.first th{
background-color:#96e;
color:#96e;
}
.second th{
background-color:#96e;
color:#96e;
}
P.S .:申し訳ありませんが、最初の回答を書いたときに私は誤解しました。この "編集された"回答はまったく異なっています... – Johannes
私はあなたに私の辛抱強さに感謝します。私はいつも素早く学習するわけではありません。私はついにそれを得た。私はネストされたテーブルを再構築するときに、最初からすべての行をテストしました。私の認識のポイントは、最後のデータセルにcolspan = 4を追加したときです。ここで、入れ子になったテーブルを配置します。次に、ネストされたテーブル自体が実際に1つのセルとして数えられることを理解しました。再び、私はあなたに感謝します。 – swydell