基金訓練に行ってきました。(52日目その1)


基金訓練(Webデザイン・プログラミング科)の52日目に行ってまいりました。
本日は、HTML&CSSプログラミングの実習です。

本日の内容は下記のとおりです。

1.テーブル(表組み)

左が見出しで右が説明で、普通の罫線の表

teble-layout 表組みをレイアウト表示する際の方法を指定するプロパティ。
table-callapse 表組みの枠の表示モデルを指定するプロパティ。
border-spacing 表組みの枠を分離表示した場合の、各セルのボーダー感覚を指定するプロパティ。

↑こんな感じです。↑

  • CSSの例は下記のとおりです。
    table {
    border: none;
    border-collapse: collapse;
    width: 300px;
    border-color: #000000;
    }
    th {
    width: 120px;
    border: solid 1px #000000;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    }
    td
    {
    border: solid 1px #000000;
    padding: 8px;
    }
  • HTMLの例は、下記のとおりです。
    <table>
    <tr>
    <th>teble-layout</th>
    <td>表組みをレイアウト表示する際の方法を指定するプロパティ。</td>
    </tr>
    <tr>
    <th>table-callapse</th>
    <td>表組みの枠の表示モデルを指定するプロパティ。</td>
    <tr>
    <th>border-spacing</th>
    <td>表組みの枠を分離表示した場合の、各セルのボーダー感覚を
    指定するプロパティ。</td>
    </tr>
    </tr>
    </table>

※paddingを設定して、セル内の文字と罫線の隙間を空けたほうが見栄えがよい。





  • 人気ブログランキングへ
  • FC2ランキングへ
  • ブログランキング・にほんブログ村へ
  • おきてがみ

関連記事

カテゴリー:職業訓練
.

1 個のコメント

  1. Posted 2010年8月14日 at 9:33 PM | Permalink

    はじめまして♪ランキングから来ました!
    また来ます!
    ポチッ。

コメントを残す