改行関連CSS, BudouXテスト

CSS

通常テキスト

このページは、文章の改行に関するCSS指定の組み合わせを確認するための物です。

デスクトップPCからアクセスし、ブラウザのウィンドウサイズを拡縮させて表示を確認する前提で作成しました。

ページ上部のフォームで改行関連のCSSプロパティを変更し、実際の動作を確認する事が出来ます。

文章中に存在する長いURLの改行が上手く行っていないケースは有りがちなミスであるため、それを検証するためにダミーのURLを記載します。 短いURL: https://exampl.org/ 長いURL: https://example.org/?dummy=012345678901234567890123456789012345678901234567890123456789

BudouXによるWBR挿入コード

この文章はBudouXによる自動WBR挿入処理を行った後のテキストになります。

BudouXのCLIに-Hオプションを指定してWBR挿入処理を行った物になります。尚、BudouXの-Hモードはword-break: keep-all; overflow-wrap: anywhere;を指定した要素で囲ったコードを返してきますが、当ページの主旨に鑑み該当部分は削っています。

BudouXの詳細: https://developers-jp.googleblog.com/2023/09/budoux-adobe.html