0

div内にあるテーブルがあります。そのテーブルには、ウィンドウに重なる巨大なコンテンツが含まれているため、そのコンテンツを表示するには左にスクロールする必要があります。問題は、テーブルを読みやすくするために右側にパディングやマージンがないことです。

そのテーブルにパディングまたはマージンを追加するにはどうすればよいですか?

html は次のようになります (以下の css は機能しないことに注意してください)。

<html>
<head></head>
<body>
<div id="table">
    <table>
        <thead>...</thead>
        <tbody>...</tbody>
    </table>  
</div>
<style>
table td, table th, table td {border: 1px solid red}
table { padding-right: 100px; border: 1px solid blue}
table thead, table tbody {padding-right: 100px;}
</style>
</body>
</html>
4

4 に答える 4

2

これを試すことができますか?

<style type="text/css">
      #table table td,#table table th,#table table td {border: 1px solid red}
      #table table { padding-right: 100px;color: blue}
      #table table thead,#table table tbody {padding-right: 100px;}
</style>
于 2013-01-15T07:44:22.423 に答える
0

css では、 のプレフィックスを付ける必要はありません。または # to table,td,tr,p,

問題に、次のコードを追加します

    #table table thead, table tbody {padding-right: 100px;}

ここで # に注意してください... # は Id セレクターであるためです。

幸運を ..!

于 2013-01-15T07:52:21.647 に答える
0

ご回答ありがとうございます。ただし、javascript を使用して行う方がはるかに簡単で、非常に柔軟であることがわかります。ここでは、jQuery フレームワークを使用しています。

 $('#table').width() = $('table').width() + 20;
 $('table').css('padding-right', '10px');

これにより、テーブルの幅が最初に意図したとおりになります。

于 2013-01-15T09:40:08.763 に答える
0

display: inline-block;テーブルに追加するだけ

于 2013-01-15T07:30:52.450 に答える