Ich muss einen Text vollständig in einen Div-Container mit 100% Breite einfügen.
Ich habe versucht, letter-spacing zu verwenden, aber es sieht so aus, als ob nur px / em und keine Prozentwerte akzeptiert werden, aber das wird nicht reagieren (z. B. das Fenster zur Größenänderung).
Das habe ich: Ссылка
Sollte ich einen anderen Ansatz wählen? Irgendwelche Ideen? Danke
Wenn Sie wissen, wie viele Buchstaben Sie haben, können Sie das mit der Einheit vw (Ansichtsfensterbreite) erreichen.
Im folgenden Beispiel habe ich einen Wert von Wenn Sie das "T" näher an die rechte Kante bringen möchten, können Sie 14.29vw verwendet, da 100 (100% der Breite des Fensters) geteilt durch 7 (die Anzahl der Buchstaben im Wort "CONTENT") etwa 14.29. letter-spacing ein wenig erhöhen. Wenn Sie die Code-Snippets von Stack Overflow verwenden, können Sie sie auf 14.67vw anwenden:
Ich habe ein jQuery-Snippet geschrieben, das den zu verwendenden Buchstabenabstand berechnet, so dass der Text die gesamte Breite des Containers verwendet: Text strecken auf Passbreite von div .
Sie können es auf den Text anwenden und es bei der Größenänderung des Fensters auslösen, so dass der Buchstabenabstand neu berechnet wird, wenn die Größe des Browsers geändert wird:
HTML:
%Vor%jQuery:
%Vor%CSS:
%Vor%Eine andere Lösung, wenn Sie nicht semantisch sein müssen, ich meine, wenn Sie nur das visuelle Ergebnis brauchen, ist die Verwendung von flexbox.
Sie haben also Ihre <div id="#myText">TEXT 1</div>
Wir müssen das bekommen:
%Vor%Also können Sie CSS anwenden:
%Vor%Um den Text in einen Bereich zu transformieren, können Sie jQuery oder was auch immer verwenden. Hier mit jQuery:
%Vor%Um bessere Ergebnisse zu erzielen, entfernen Sie den Buchstabenabstand: 0 in #myText, damit jeder zusätzliche Abstand angewendet wird.
Tags und Links html css letter-spacing