問題タブ [wbr]

Web ページのソフト ハイフンの問題をどのように解決しますか? テキストには、ハイフンで改行したい長い単語がある場合があります。ただし、単語全体が同じ行にある場合は、ハイフンを表示したくありません。

このページ のコメントによると<wbr>、非標準の「Netscape によって発明されたタグ スープ」です。­ 標準準拠にも問題があるようです。すべてのブラウザで機能するソリューションを入手する方法はないようです。

ソフトハイフンの処理方法はどれですか?なぜそれを選択したのですか? 推奨されるソリューションまたはベスト プラクティスはありますか?

テーブルのヘッド セルでタグを使用してきたので、ブラウザーが長い単語を分割する場所を制御できます。これはうまく機能しますが、XHTML に準拠していません。有効な XHTML である wbr タグを使用するための最良の代替手段は何ですか? 例：

基本的に、必要に応じて休憩を適用できる特定の領域を指定できる<wbr>要素（リンク）を見つけました。

基本的には、ブログのコメントが文字や記号が多すぎてレイアウトが崩れないように、アプリに実装したいと思います。

問題は、HTML互換である必要があるため、averylongmadeupandunnecesaryunspacedword25文字ごとに分割される可能性がありますが、リンクは切断されません<a href="http://www.google.com/search?hl=en&source=hp&q=averylongandunnecesarywordingoogle&aq=f&aql=&aqi=&oq=">link</a>。

静的テキストへのリンクを追加するために「Linkify」を使用しています...これは私が使用しているものです：

https://github.com/maranomynet/linkify/blob/master/1.0/jquery.linkify-1.0.js

<wbr>15文字の後に（単語区切り）を追加したいのですが…、30文字程度の後に追加したいのですが...（リンクが30文字未満の場合は、追加しないでください…）

したがって、リンクは次のようになります。https://github.com/mara<wbr></wbr>nomynet/linkify&hellip;

そのjquery.linkify-1.0.jsでvar"$2"を使用する必要があると思いますが、その方法について少し混乱しています...

どんな手掛かり？

ありがとう！

DIV に複数の単語からなる長いテキスト行があるとします。

こんにちは、親愛なるお客様。私たちのオファーをご覧ください。

DIV には動的な幅があります。上記のテキストをワードラップしたい。現在、折り返しは最初の行の長さを最大化する単語境界で発生します。

折り返しが文の境界で発生することをお勧めします。ただ、ラッピングが不要な場合は、ラインはそのままでお願いします。

私の要点を説明するために、さまざまな DIV 幅と、テキストをどのように折り返すかを見てください。

単語では、提案された音節境界で単語の折り返しが発生するように、ソフト ハイフンを使用できます。ラッピングが不要な場合、 は表示されません­。ラッピングが必要な場合は、次の­場所で行います。

HTMLでワードラップをヒントする類似の方法はありますか?

デフォルトでは、lxmlはwbrタグを理解していません。これは、長い単語に単語区切りを追加するために使用されます。brタグと同様に、<wbr></wbr>単純にとしてフォーマットする必要がある場合と同じようにフォーマットします。<wbr>

この動作をlxmlに追加するにはどうすればよいですか？

奇妙な問題が発生しました。

お客様の銀行予約にトランザクション ID を次の形式で使用しています: U123C123P123B123.

テスト予約の後、「ctrl+c」を使用して、オンライン バンキングの出力からトランザクション ID (正しく表示された) テキストをコピーしました。(strg+v を貼り付けて) システムに再度入力されたこのテキストは、次の理由により処理できませんでした。

貼り付け時、「<wbr>」はマイナス記号に変わります。マイナス記号はフォーム フィールドに表示されません。しかし、それは通過します。MySQL は、その奇妙なマイナス記号でリクエストを処理できません。

バンク出力のソース コードは次のとおりです: " U123C123P123<wbr>B123"。

ほとんどのソフトウェア (firefox、thunderbird など) は、貼り付け後に正しい T-ID を表示します。notepad++、Dreamweaver などの一部のエディタでは、マイナス記号を含む貼り付けられた T-ID が表示されます。いいね: " U123C123P123-B123"

この薄暗いマイナス記号を削除するにはどうすればよいですか? 私はすでに str_replace と strip_tags を試しました。

私の英語でごめんなさい。

要するに、これは悪いWeb開発とUXです。

しかし、CSS3ワードブレイク（コードとデモ）を使用してそれを解決すると、「厄介な空白」の状況と奇妙なカットオフにつながる可能性があります-両方の例を次に示します。

多分それはそれほど大したことではなく、それのUXの視点はここにありますが、解決策の1つのセマンティクスを見てみましょう：

<wbr>この要素を使用して、オプションの単語区切りの機会を示すことができます。これにより、コンテナ内の新しい行に流れるように、必要に応じて改行を挿入するようにブラウザに指示されます。

最初の質問：<wbr>セマンティックHTMLを使用していますか？（少なくとも優雅に劣化しますか？）

どちらの場合でも、一般的な意味でセマンティックでないことは、優れたUX機能に支払うための小さな代償であるように思われます。

ただし、2番目の質問は全体像に関するものです。

電子メールアドレスを分割するために使用するときに考慮すべきschema.org（microdata / RFDa）の影響はありますか？それはまだそこで有効ですか？<wbr>

<wbr>ハイフンでつながれた単語が行 (または行) の残りのスペースに収まらない場合に、firefox に改行を強制するためにタグを使用していますが、 quirksmode Web サイトによると、 IE8 はこのタグをまったく尊重しません。

自分で確認することはできませんが、次のマークアップで IE8 はどうなるでしょうか? 列の幅が 200px、font-size が 16px、ハイフンでつながれた単語が収まらないとします。

<wbr>これは、物事を明確にするための画像で、タグの有無にかかわらず FF で何が起こるかを示しています。

IE8 がタグを無視することはわかっていますが、Chrome や Safari のようにハイフンで改行しますか?