◆ 3学部紹介ページのヒント

   2番目のテーブルの形式は、次のように考える。

HTMLの指定
表示されるテーブル
<TABLE border="1" width="680" align="center">

<TR>        ----1行目----
  <TD width="20" bgcolor="maroon">空白</TD>
  <TD width="300" bgcolor="yellow">情報学部</TD>
  <TD width="40">空白</TD>
  <TD width="20" bgcolor="maroon">空白</TD>
  <TD width="300" bgcolor="yellow">短期大学部</TD>
</TR>

<TR>        ----2行目----
  <TD>空白</TD>
  <TD valign="top">
    <BR>
    ○○○学科<BR>
    ×××学科<BR>
  </TD>
  <TD rowspan="3">空白</TD>
  <TD rowspan="3">空白</TD>
  <TD rowspan="3" valign="top">
    <BR>
    ●●●学科<BR>
    ▲▲▲学科<BR>
  </TD>
</TR>

<TR>        ----3行目----
  <TD bgcolor="maroon">空白</TD>
  <TD bgcolor="yellow">国際学部</TD>
</TR>

<TR>        ----4行目----
  <TD>空白</TD>
  <TD valign="top">
    <BR>
    ◎◎◎学科<BR>
    ◇◇◇学科<BR>
  </TD>
</TR>

</TABLE>




( セル幅は合計で 680 )

 (20)       (300)       (40)   (20)      (300)     
空白 情報学部 空白 空白 短期大学部
空白
○○○学科
×××学科


空白

空白

●●●学科
▲▲▲学科
空白 国際学部
空白
◎◎◎学科
◇◇◇学科



  「説明」
  • 全部で4行のテーブルになる

  • 1行目のTRタグの中に、<TD> 〜 </TD>が5個入る (ここで幅を指定 width="xx"


  • 2行目のTRタグの中に、<TD> 〜 </TD>が5個入る (3箇所に rowspan="3" を指定)


  • 3行目および4行目のTRタグの中には、<TD> 〜 </TD>が2個入る


  • 背景色の指定は6箇所 (bgcolor="色"


  • 学科名称を入れるセルは、文字配置を「上詰め」にするとよい (valign="top"