これは私を狂ってしまいました。なぜ私はテーブルの "X"をテーブルの一番下に合わせることができないのか分かりません...私はCSSの別の場所に縦線を入れてみましたが、役に立たなかったのです。 。また、ここではなぜこのテーブルでは「垂直整列:ボトム」で作業していません
?私は私のテーブル内の空白のスポットを正しく使用しています両方の私のHTMLとCSSファイルの切れ端です...任意のコメントをいただければ幸いです
<html>
<head>
<title>Day4: Table King</title>
<link rel="stylesheet" type="text/css" href="stylesday4.css" />
</head>
<body>
<table id="products">
<tr>
<th><span></th>
<th>Free Version</th>
<th>Lite Version</th>
<th>Full Version</th>
</tr>
<tr>
<td>Advertising</td>
<td id="td">X</td>
<td><span></td>
<td><span></td>
</tr>
<tr class="alt">
<td>Catering Software</td>
<td><span></td>
<td id="td">X</td>
<td id="td">X</td>
</tr>
....
#products
{
border-collapse:collapse;
width:100%;
}
#products th, #products td
{
border:1px solid #0000FF;
background-color:#C0C0C0;
padding:3px 2px 7px 5px;
}
#products th
{
font-size:20px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#0000FF;
padding-top:4px;
padding-bottom:5px;
background-color:green;
}
#products td
{
vertical-align:bottom;
}
#products tr
{
text-align:center;
color:#0000FF;
}
#products tr.alt td
{
color:blue;
background-color:#A7C942;
}