複雑なtableの記載例

f:id:kenji148:20200111095139p:plain
イメージ図

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title></title>
  <style>
    table td {
      padding: 10px;
    }
  </style>
</head>
<body>
 <div>
    <table border="1">
      <tr>
        <td>ブックマーク</td>
        <td rowspan=3 colspan="2">
          ああああああああああああ<br>
          888888888888<br>
          あああああああああ
        </td>
      </tr>
      <tr>
        <td>
        検索条件
        </td>

      </tr>
      <tr>
        <td rowspan="5">
        <table frame="hsides" bgcolor="#cccccc">
        <tr>
        <td>
        氏名<input type="text" id="name"><br>
        氏名2<input type="text" id="name"><br>
        氏名3<input type="text" id="name"><br>
        氏名4<input type="text" id="name">
        </td>
         <td>
        氏名<input type="text" id="name"><br>
        氏名2<input type="text" id="name"><br>
        氏名3<input type="text" id="name"><br>
        氏名4<input type="text" id="name">
        </td>
        </tr>
        </table>
      </tr>
      <tr>
        <td>111</td>
        <td>
        ううううううう
        </td>
      </tr>
      <tr>
        <td>222</td>
        <td>
        えええええええ
        </td>        
      </tr>
      <tr>
        <td>333</td>
        <td >
        えええええ
        </td>        
      </tr>
      <tr>
        <td colspan="2">
          <a href="#" target="_blank" class="btn">詳細を見る</a>
        </td>
      </tr>
    </table>
  </div>
</body>
</html>