css3 で改行を強制的に行わない方法: 最初に HTML サンプル ファイルを作成し、次に p タグを作成し、最後に改行を強制的に行わないように「white-space:nowrap;」スタイルを設定します。
#この記事の動作環境: Windows 7 システム、CSS3 バージョン、Dell G3 コンピューター。
css は、強制的な非行折り返し/自動行折り返し/強制行折り返しを実装します
日常のコーディングでは、このテキストを折り返したり自動的に折り返したりできないという要件によく遭遇します。この機能は私たちの日常生活で非常に一般的ですが、誰もがそれを覚えられないと思います(少なくとも 小月は非常に怠け者で、自分が何を使用しているかをまったく確認しません...)。今日は、css を使用してテキストを強制的に折り返さない/自動的に折り返す/テキストを強制的に折り返す方法をマスターする方法を学びます。必要な友達が来て一緒に学びましょう!
#行折り返しを強制しない-
p{
white-space:nowrap;
}
ログイン後にコピー
自動行折り返し-
p{
word-wrap: break-word;
word-break: normal;
}
ログイン後にコピー
英単語を強制的に改行する-
p{
word-break:break-all;
}
ログイン後にコピー
##CSS 設定では改行されません:
overflow:hidden Hide
white-space:normal デフォルト- pre改行とその他の空白文字は保護されます
- nowrapは、すべてのテキストを強制的に同じ行に表示します。テキストの終わりまたは br オブジェクトが検出されました
-
- 強制改行を設定します:
word-break:
normal ; テキストによるとアジア言語と非アジア言語のルール、単語内の改行は許可されます- break-all : この動作はアジア言語の通常の動作と同じです。非アジア言語のテキスト行の任意の単語内での区切りも許可されます。この値は、アジア以外のテキストを含むアジアのテキストに適しています。
- keep-all : すべての非アジア言語の通常と同じです。中国語、韓国語、日本語の場合、単語の区切りは許可されません。少量のアジア語テキストを含む非アジア語テキスト間の高さの解決に適しています
-
- 改行なしの英語
CSS里加上 word-break: break-all; 问题解决。这个问题只有IE才有,在FF下测试,FF可以自己加滚动条,这样也不影响效果
建议大家做Skin时,记得在body里加 word-break: break-all; 这样可以解决IE的框架被英文撑开的问题
以下引用word-break的说明, 注意word-break 是IE5+专有属性
ログイン後にコピー
構文:
ワードブレイク: 通常 | ブレークオール | キープオール
パラメータ:
Normal: アジア言語と非アジア言語のテキスト ルールに従って、単語内での改行を許可します。
Break-all: この動作はアジア言語の通常の動作と同じです。非アジア言語のテキスト行の任意の単語内での区切りも許可されます。この値は、アジア以外のテキストを含むアジアのテキストに適しています。
keep-all : すべての非アジア言語の通常と同じです。中国語、韓国語、日本語の場合、単語の区切りは許可されません。少量のアジア語テキストを含む非アジア語テキストに適しています
例証します:
オブジェクト内のテキストのワードラップ動作を設定または取得します。特に複数の言語が登場する場合。
中国語の場合は、ブレークオールを使用する必要があります。
推奨学習: 「
css ビデオ チュートリアル
」
以上がCSS3で強制的に改行をしないようにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。