ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSで行折り返しを超えてdivを設定する方法
CSS では、「word-break」属性を使用して、div の改行を超える効果を実現できます。この属性により、div コンテンツが最後で自動的に折り返されます。構文は「div{word-break」です。 :break-all;} "。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
css で行の折り返しを超えて div を設定する方法
CSS では、word-break 属性を使用して、自動行折り返しの処理方法。
word-break 属性を使用すると、ブラウザは任意の位置で改行を実現できます。
構文は次のとおりです:
word-break: normal|break-all|keep-all;
次の点に注意してください:
normal はブラウザのデフォルトの行折り返しルールを使用することを意味します。
#break-all は、単語内で改行が許可されることを示します。
#keep-all は、半角スペースまたはハイフンでのみ改行できることを意味します。
改行以降に div を設定する方法を例に挙げてみましょう。例は次のとおりです:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <style type="text/css"> div{ width:50px; word-break:break-all; } </style> <div> aaaaaaaaaaaaaaaaaaaaaaaaaaaa </div> </body> </html>
出力結果:
プログラミング関連の知識については、プログラミング ビデオをご覧ください。 !
以上がCSSで行折り返しを超えてdivを設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。