0
私はHTMLテーブルを取得しました。中間の種類の2つの列の間にスペースを追加して、テーブルを半分にしたいのです。 4番目と5番目の列の間。 別の列を中央に置き、その列の上下の境界線をオフにしたいのですか？テーブル内の2つの列の間に空白を追加する
どうすればいいですか？ Fiddle
<!DOCTYPE html>
<html lang="en">
<head>
<style>
h1 {
background-color: orange;
font-family: "Times New Roman", Times, serif;
font-size: 40px;
}
p {
background-color: rgb(255,0,0);
}
/*** CODE HAS BEEN CHANGED HERE ***/
td.image {
text-align: center;
}
table, th, td {
border-bottom: 1px solid black;
border-left: none;
border-right: 1px solid black;
border-top: none;
border-collapse: collapse;
}
</style>
</head>
<body>
<table>
<col width="120">
<col width="60">
<col width="100">
<col width="300">
<col width="120">
<col width="60">
<col width="100">
<col width="300">
<tr>
<td style="text-align:right; padding-right: 8px;">Friday <br>clear <br>88 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/clear.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 10 % <br> Rain: 0.00 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">A few clouds. Lows overnight in the mid 60s. <br></td> <td style="text-align:right; padding-right: 8px;">Friday Night <br>nt_clear <br>66 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/nt_clear.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 10 % <br> Rain: 0.00 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Mainly clear. Low 66F. Winds light and variable. <br></td> </tr>
<tr>
<td style="text-align:right; padding-right: 8px;">Saturday <br>clear <br>90 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/clear.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 10 % <br> Rain: 0.00 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Abundant sunshine. High near 90F. Winds SSW at 5 to 10 mph. <br></td> <td style="text-align:right; padding-right: 8px;">Saturday Night <br>nt_tstorms <br>67 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/nt_tstorms.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 80 % <br> Rain: 0.24 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Scattered thunderstorms in the evening, then mainly cloudy overnight with thunderstorms likely. Low 67F. Winds S at 5 to 10 mph. Chance of rain 80%. <br></td> </tr>
<tr>
<td style="text-align:right; padding-right: 8px;">Sunday <br>tstorms <br>76 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/tstorms.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 90 % <br> Rain: 0.52 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Thunderstorms likely. High 76F. Winds S at 5 to 10 mph. Chance of rain 90%. <br></td> <td style="text-align:right; padding-right: 8px;">Sunday Night <br>nt_tstorms <br>66 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/nt_tstorms.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 100 % <br> Rain: 0.85 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Thunderstorms likely. Low 66F. Winds SSW at 5 to 10 mph. Chance of rain 100%. <br></td> </tr>
<tr>
<td style="text-align:right; padding-right: 8px;">Monday <br>tstorms <br>79 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/tstorms.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 80 % <br> Rain: 0.16 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Thunderstorms likely. High 79F. Winds NW at 5 to 10 mph. Chance of rain 80%. <br></td> <td style="text-align:right; padding-right: 8px;">Monday Night <br>nt_chancetstorms <br>60 ˚F<br><td class="image"><img src="http://icons.wxug.com/i/c/k/nt_chancetstorms.gif" alt="W3Schools.com"</img></td>
<td style="padding-left: 8px;"> Prep: 50 % <br> Rain: 0.01 in <br> Snow: 0.00 in <br></td>
<td style="vertical-align:top; padding-left: 8px;">Scattered thunderstorms in the evening. Cloudy skies overnight. Low around 60F. Winds light and variable. Chance of rain 50%. <br></td> </tr>
</table>
</html>
</body>
おかげで、テーブルのデータを使用することができ、これは私がまさに必要です –