ウェブランサー

<multicol> 段組する(NN独自)

対応ブラウザ
IE7非対応IE8非対応Firefox非対応Chrome非対応Opera非対応Safari非対応
タイプ -
取り扱い 独自仕様

<multicol>タグは、Netscape Navigatorが独自に採用したタグです。段組を行う際に便利なタグですが、現行のバージョンでは廃止されています。見栄えの指定に関してはスタイルシートを使いましょう。

<multicol>タグに指定できる属性

width="値"
段組全体の幅を「px」や「%」で指定。
cols="値"
いくつ段組を作成するかを数字で指定。
gutter="値"
段組と段組の間隔を指定。初期値は10pxです。

<multicol>の使用サンプル

HTML
<multicol width="400px" cols="3" gutter="15px">
<p>
<font color="#FF0000">1カラム目</font><br />
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!
</p>

<p>
<font color="#FF0000">2カラム目</font><br />
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!
</p>

<p>
<font color="#FF0000">3カラム目</font><br />
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!
</p>
</multicol>
表示確認

対応しているブラウザで見るとこのような段組で表示されます。
※色とサイズはイメージです。

1カラム目
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!
2カラム目
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!
3カラム目
HTMLで段組を表現する事は少し苦労するかも知れません。しかし、段組のやり方を正しく理解すれば、もっとウェブサイト制作が楽しくなります。HTMLを覚えたら是非スタイルシート(CSS)に挑戦してみて下さい!

※見やすくするためにCSSで装飾しています

<multicol>に関連するHTMLタグ

廃止または非推奨になったHTMLタグ一覧
<acronym> 略語(頭字語)であることを表す
<applet> JAVAアプレットを埋め込む
<basefont> 文字の基準となるサイズ、色、フォントの指定
<bgsound> 効果音やバックミュージックを鳴らす(IE独自)
<big> 文字をひと周り大きく表示する
<blink> 文字を点滅させる
<center> センタリングする
<dir> リストを表示する
<font> フォントの色や大きさを変える
<frame> フレームに表示するファイルを指定する
<frameset> ウィンドウを分割する
<hgroup> 見出しをグループ化してセクションのヘッダを表す
<keygen> フォーム送信時に暗号鍵を発行する
<listing> タグを解釈し、ソースをそのまま表示する
<marquee> 文字列をスクロールさせる(流れる文字)
<multicol> 段組する(NN独自)
<nobr> 自動改行を無効にする(NN独自)
<noembed> プラグインが利用できない環境での表示内容を指定する(NN独自)
<noframes> フレームが表示できない環境での表示内容を指定する
<plaintext> ソースをテキストとしてそのまま表示する
<spacer> スペースを挿入する(NN独自)
<strike> 文字列に打ち消し線を引く
<tt> 文字を等幅フォントで表示する
<xmp> ソースをそのまま表示する