ホームページ >ウェブフロントエンド >CSSチュートリアル >固定幅の HTML ボタンでテキストを折り返す方法

固定幅の HTML ボタンでテキストを折り返す方法

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-10-31 09:16:29469ブラウズ

How to Make Text Wrap in Fixed-Width HTML Buttons?

固定幅の HTML ボタンでテキストの折り返しを制御する方法

幅が事前に定義された HTML ボタンでは、多くの場合、テキストが改行されないままになり、厄介な切り捨て。この記事では、表のセルなどのボタン テキストのシームレスなラッピングを可能にする、この問題の解決策を検討します。

失敗したアプローチの 1 つは、word-wrap プロパティの使用です。直感的に見えるかもしれませんが、文字の途中で単語が切れてしまう可能性があります。

代わりに、鍵となるのは空白の CSS プロパティです。ボタンを通常に設定すると、通常のテキストと同じようにテキストを改行できます:

<code class="css">white-space: normal;</code>

次のボタンについて考えてみましょう:

<code class="html"><input type="submit" ... style="width: 200px; white-space: normal;">Roos Sturingen / Sensors</input></code>

空白プロパティが に設定されている場合通常、テキストは固定幅内で適切に折り返され、見苦しい単語の分割が回避されます。

以上が固定幅の HTML ボタンでテキストを折り返す方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。