忍者ブログ
手探りでパソコンの事を勉強するブログです。 何か覚えたら記録していきます。
2024 . 11
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  •   

    [PR]



    このエントリーをはてなブックマークに追加
    ×

    [PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

    面白いテーブルレイアウト



    このエントリーをはてなブックマークに追加
    寝る前に面白いテーブルレイアウトを思いついたので紹介します。
    セルを結合させる方法で設計しました。
    個人的な感想ですが、こういったテーブルレイアウトは紙などに設計図を書いてからソースを考えたほうが作りやすいと思います。
    すでに誰かが思いついているかも知れませんが一応。。。

    横方向のテーブルセル結合 colspan="数"
    縦方向のテーブルセル結合 rowspan="数"

    <th></th>や<td></td>に適用して使用して下さい。
    1 2
    3 4
    5

    ソース

    <table height="500" width="500" border="1">
        <tbody>
            <tr>
                <td height="30%" width="70%" colspan="2">1</td>
                <td height="70%" width="30%" rowspan="2">2</td>
            </tr>
            <tr>
                <td height="70%" width="30%" rowspan="2">3</td>
                <td
    height="70%" width="30%">4</td>
            </tr>
            <tr>
                <td height="30%" width="70%" colspan="2">5</td>
            </tr>
        </tbody>
    </table>

    PR




    ■ この記事にコメントする
    お名前
    タイトル
    文字色
    URL
    コメント
    パスワード
    Vodafone絵文字 i-mode絵文字 Ezweb絵文字
    ■ コメント一覧
    ■ この記事のトラックバック
    この記事にトラックバックする:
    右クリック禁止を解除するjavascript HOME FMV-BIBLO NF/A50 ノートパソコンのメモリ交換
    ©パソコン手探り all rights reserved.
    Powered by ニンジャブログ  Designed by ピンキー・ローン・ピッグ
    忍者ブログ / [PR]