[WEB制作]数字のデータや用語などをまとめるときに、表を使って説明することがあります。HTMLでは、「table要素」を使ってマークアップしていきます。CSSが普及する前までは、table要素を使ってWebページのレイアウトが行われていました。これは、table要素の本来の目的では無いですが、tableレイアウトとして主流だった時代があります。現在だと、div要素を使ってグループ化するレイアウトが主流ですから、table要素をレイアウトには使用しない方が良いでしょう。ここでは、表を作るためのtable要素について解説します。table要素の仕組みについてtableを記述するときには、それ単体で使うことはありません。内部に、「tr要素」(行)、「th要素」(列の見出し)、「td要素」(列)などが入ります。<table>~</table>という大きな箱があって、その中に<tr>~</tr>や<td>~</td>などの行や列を入れていくという形です。border=”1′′><tr><th>会社概要</th><td>サバサバ株式会社</td></tr><tr><th>所在地</th><td>東京都港区芝公園</td></tr><tr><th>代表者</th><td>山田太郎</td></tr></table>tableタグでマークアップすると、以下のような表示となります。th要素(列の見出し)でマークアップされた箇所は、デフォルトだと太字で表示されます。枠線や余白の広さなどは、CSSで指定するのが一般的です。行や列を結合したい場合には、th要素やtd要素に「colspan属性」や「rowspan属性」を追加します。「colspan属性」は水平方向の行を結合し、「rowspan属性」は垂直方向の列を結合するときに使用します。それぞれの値に、結合させたい数を入力すれば、その分だけ結合されます。rowspan=”2′′>代表者</th><td>山田太郎</td></tr><tr><td>山田花子</td></tr></table>行や列を結合させると、ソースが複雑になりますから注意しましょう。table要素に付加情報を加える表を作成したら、そのタイトルや説明文を付けることができます。表の目的や構造を示したいときには、「summary属性」を追加しましょう。summary=”会社概要”>などとすれば、どういった目的の表なのかを示すことが出来ます。ブラウザには表示されず、コンピュータに伝えたい場合に使用するものです。目に見える形で表の説明文を入れたいなら、「caption要素」を使用しましょう。<caption>表のタイトル</caption>とすることで、表にタイトルや説明文を追加できます。これらは必須ではありませんから、状況に合わせて追加してください。以上、table要素について解説をしました。情報をキレイにまとめるために、table要素は利用価値が高いです。上手く使いこなせるようにしましょう。機能性重視のレンタルサーバースペックの高さで選ぶ容量の大きさで選ぶマルチドメイン無制限から選ぶデータベース無制限から選ぶVPSで選ぶWordPress向けで選ぶサポートの充実度で選ぶお得なレンタルサーバーコストパフォーマンスで選ぶ料金の安さで選ぶ初期費用無料で選ぶ個人向けから選ぶ仕事で使うレンタルサーバービジネスサイト向けで選ぶアフィリエイト向けから選ぶネットショップ向けから選ぶアダルト向けから選ぶおススメのレンタルサーバーエックスサーバーロリポップヘテムルさくらのレンタルサーバーハッスルサーバーファイアバードミニバード最近の投稿ホスティングとハウジングの違いとは?レンタルサーバーの転送量制限とは何か?リンクベイト用のコンテンツで被リンクを獲得するSMO対策(ソーシャルメディア最適化)で被リンクを獲得する被リンクを集めやすいコンテンツを作る秘訣サイト内検索サバサバ倶楽部レンタルサーバーの比較や使い方を紹介するサイトです。Reserved.このページの先頭へ。