改行やスペースの扱いを指定する

[新着] TAG indexオフライン版 3.0 を準備中です


white-space: ***;

ブラウザ
Internet Explorer5.5 Netscape Firefox Opera
参考
書式基本 要素名 クラス ID

white-space は、改行、半角スペース、タブの扱いを指定するプロパティです。


p {
white-space: nowrap;
}


white-space normal … (標準)デフォルト
nowrap … (自動改行を禁止します)Internet Explorer5.5Netscape6FirefoxOpera
pre … (書いたままの形で表示します)Internet Explorer6NetscapeFirefoxOpera

表示モードが「互換モード」の場合、IEでは pre の指定が機能しません。

normal(標準)

nowrap(自動改行禁止)

pre(書いたままの形で表示)

-pre-wrap(書いたままの形で表示 + 自動改行)Opera (独自拡張:Operaのみ対応)

メモ

書いたままの形で表示したい場合は、スタイルの指定ではなくpre要素を使用した方が良いでしょう。


使用例

nowrapの指定例

<html>
<head>
<title>TAG index Webサイト</title>

<style type="text/css">
<!--

#example { white-space: nowrap; }

-->
</style>

</head>
<body>

<p>【スタート→】タグインデックスは、ホームページの作成に役立つタグの簡単検索サイトです。HTMLタグのほか、スタイルシートやJavaScript、カラーチャート、ホームページ制作ガイド、CGIの設置方法、ホームページ制作の意識調査、エンコード・デコードフォーム、などなど、ホームページ制作に関する情報が満載のWebサイトです。【→ゴール】</p>

<p id="example">【スタート→】タグインデックスは、ホームページの作成に役立つタグの簡単検索サイトです。HTMLタグのほか、スタイルシートやJavaScript、カラーチャート、ホームページ制作ガイド、CGIの設置方法、ホームページ制作の意識調査、エンコード・デコードフォーム、などなど、ホームページ制作に関する情報が満載のWebサイトです。【→ゴール】</p>

</body>
</html>

これをブラウザで見ると次のように表示されます


preの指定例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TAG index Webサイト</title>

<style type="text/css">
<!--

div { white-space: pre; }

-->
</style>

</head>
<body>

<div>

コードなどを記述する際に便利です。

sub example {

	if ($value eq 'えじ') {

		$flag = 1;

	}
	else {

		$flag = 0;

	}

}
</div>

</body>
</html>

これをブラウザで見ると次のように表示されます



[特集] レンタルサーバー比較 & サーバー選びのチェックポイント

サイト内検索について - ベーシック版