1

XHTML 1.0 Transitional Webページのテーブル行に境界線とパディングを追加しようとしています(再現するには、以下のコードを参照してください)。ページの種類を別のものに変更すると、テーブルの行とセルに境界線とパディングを追加できるようになることを私は知っています。しかし、XHTML 1.0 Transitionalでは、まったく機能しません。

DOCTYPEを変更できないことを考えると、テーブルに境界線とパディングを追加するにはどうすればよいでしょうか。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <style>
            table
            {
                border: solid 1px black;
            }

            tr
            {
                /* Doesn't work */
                margin: 10px;
                border: solid 1px black;
            }
        </style>
    </head>
    <body>
        <table>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
                <tr>
                    <td>4</td>
                    <td>5</td>
                    <td>6</td>
                </tr>                
            </tbody>
        </table>
    </body>
</html>
4

2 に答える 2

1

各セルの周囲にスタイルを適用する場合は、trではなくtd要素にスタイルを適用します。trにスタイルを適用すると仮定すると、これが機能する理由は完全にはわかりませんが、テーブルにborder-collapseを追加するとtrが作成されます。ボーダーワーク:

            table
            {
                border: 1px solid black;
                border-collapse:collapse;
            }

            tr
            {
                /*use if you want the lines to be per row instead of per cell*/
                border: 1px solid black;
            }

余白については、td要素にパディングを適用します。

            td
            {
                padding: 10px;

                /*use if you want lines between each cell*/
                border: 1px solid black;
            }
于 2010-07-13T01:06:46.473 に答える
1

境界線とマージンがtdで機能するかどうかを確認してみてください。

td
{ 
    margin: 10px; 
    border: solid 1px black; 
} 

その場合は、中央のセルに対してのみ上/下の余白にする必要があります。

于 2010-07-13T01:09:45.187 に答える