CSS tableにmarginを指定して外側の余白を表示する

2022年10月27日

環境
Google Chrome　106.0.5249.119
Windows 10 Home 64bit

構文
margin : 値
上下左右を指定します。
marginは、要素の外側の余白で隣の要素と距離を取ります。
marginで左右をautoにすると中央寄せが可能です。

使用例

<!DOCTYPE html>
<html>
<head>
<style>
/*div要素のクラスcft*/
.cft {
    background: skyblue;
    overflow: hidden;
}
.cft table{
/*外側の余白 左右 auto*/
   margin: 15px auto 10px;
}
</style>
</head>
<body>
<div class="cft">
    <table border="1">
        <tr>
            <td>AA11</td>
            <td>AA12</td>
        </tr>
        <tr>
            <td>BB11</td>
            <td>BB12</td>
        </tr>
    </table>
</div>

</body>
</html>

CSS

Posted by arkgame

関連記事: