[新着] Webテンプレートを仮オープンしました
white-space は、改行、半角スペース、タブの扱いを指定するプロパティです。
p {
white-space: nowrap;
}
| white-space | normal … (標準)デフォルト |
|---|---|
| nowrap … (自動改行を禁止します) |
|
| pre … (書いたままの形で表示します) |
※表示モードが「互換モード」の場合、IEでは pre の指定が機能しません。
■normal(標準)
■nowrap(自動改行禁止)
■pre(書いたままの形で表示)
※-pre-wrap(書いたままの形で表示 + 自動改行)
(独自拡張: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>
▼これをブラウザで見ると次のように表示されます