0

そのため、テーブルクラスを使用してテーブルを作成し、テーブルのエッジを丸めたいのですが、このコードを使用すると、すべてのセルが丸められます。テーブルだけを丸めるにはどうすればよいですか？ありがとうございました

   <!DOCTYPE html>
<html>
<head>
<style type="text/css">
table
{
border-collapse:collapse;
}
table, td, th
{
/* This is to have rounded corners */

border:1px solid black;  
/*  change to 1 if border needed */
}
table.margin
{
margin-top:25px;
}

table.margin2
{
margin-top:15px;

border-radius:5px;
-moz-border-radius:5px;
}
4

2 に答える 2

1

丸みを帯びた角のコードをテーブルtd、thから削除する必要があります。これは、丸みを帯びた角のコードをこれらすべての要素に適用するためですが、テーブルに移動すると{/*丸みを帯びた角のコードはここにあります*/}その場合、tdとthには適用されません。

このコードはChromeで動作します。

<!DOCTYPE html>
<html>
  <head>
    <style type=text/css>
      .rounded_edges {
        -moz-border-radius: 15px;
        border-radius: 15px;
        border: 1px solid black;
      }
    </style>
  </head>

  <body>
    <table class="rounded_edges">
      <tr>
        <th>Head 1</th>
        <th>Head 2</th>
        <th>Head 3</th>
      </tr>
      <tr>
        <td>Cell 1-1</td>
        <td>Cell 1-2</td>
        <td>Cell 1-3</td>
      </tr>
      <tr>
        <td>Cell 2-1</td>
        <td>Cell 2-2</td>
        <td>Cell 2-3</td>
      </tr>
    </table>
  </body>
</html>
于 2012-06-30T00:57:10.477 に答える
0

テーブルを使用している場合は、次のスタイルで入力してください。

border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;
于 2013-12-22T06:31:33.923 に答える