html - tag - wordpress seo titel




Wie man auf einem Strich Wort-bricht? (7)

Als Teil von CSS3 wird es noch nicht vollständig unterstützt, aber Sie finden hier Informationen zum Wortumbruch . Eine weitere Option ist das wbr-Tag & shy; und & # 8203; Keine davon wird vollständig unterstützt.

Angesichts eines relativ einfachen CSS:

div {
  width: 150px;
}
<div>
  12333-2333-233-23339392-332332323
</div>

Wie mache ich es so, dass der String auf die width von 150 beschränkt bleibt und einfach zu einem Newline auf dem Bindestrich umbrochen wird?


Anstatt - Sie &hyphen; oder \u2010 .

Stellen Sie außerdem sicher, dass die Bindestrich- CSS-Eigenschaft nicht auf " Keine" festgelegt wurde (der Standardwert ist " Manuell" ).

<wbr> wird von Internet Explorer nicht unterstützt.


Ersetzen Sie Ihre Bindestriche durch Folgendes:

&shy;

Es wird ein "weicher" Bindestrich genannt.

div {
  width: 150px;
}
<div>
  12333&shy;2333&shy;233&shy;23339392&shy;332332323
</div>


Hoffe, das kann helfen

Verwenden Sie das (break) -Tag, an dem Sie die Zeile unterbrechen möchten.


In allen modernen Browsern * (und auch in einigen älteren Browsern ) ist das <wbr> -Element das perfekte Werkzeug, um lange Wörter an bestimmten Stellen zu unterbrechen.

Um von diesem Link zu zitieren:

Das HTML-Element "Word Break Opportunity" ( <wbr> ) stellt eine Position innerhalb des Texts dar, in der der Browser optional eine Zeile unterbrechen kann, obwohl die Zeilenumbruchregeln andernfalls nicht zu einer Unterbrechung an dieser Position führen würden.

Hier ist, wie es im Beispiel des OP verwendet werden könnte (oder es in Aktion bei JSFiddle ):

<div style="width: 150px;">
  12333-<wbr>2333-<wbr>233-<wbr>23339392-<wbr>332332323
</div>

* Ich habe es in IE9, IE10 und den neuesten Versionen von Chrome, Firefox, Opera und Safari getestet.

div {
  width: 150px;
}
<div>
  12333-<wbr>2333-<wbr>233-<wbr>23339392-<wbr>332332323
</div>


In dieser spezifischen Instanz (in der die Zeichenfolge Bindestriche enthält) würde ich den Text in diese Server-Seite umwandeln:

<div style="width:150px;">
  <span>12333-</span><span>2333-</span><span>233-</span><span>23339392-</span><span>332332323</span>
</div>

Sie können auch verwenden:

word-break:break-all;

Ex.

<div style='width:10px'>ababababababbabaabababababababbabababa</div>

Ausgabe:

abababababa
ababababbba
abbabbababa
ababb

word-break bricht das gesamte Wort oder die Zeile, auch wenn kein Leerzeichen im Satz steht, das nicht in der angegebenen Breite oder Höhe steht. Mutter dafür müssen Sie eine Breite oder Höhe bereitstellen.





text