Verwendung von <span> zum Hinzufügen einer Richtung (dir = "rtl")

Question

Ich bin neu bei html und benutze viel Hebräisch. Ich stieß auf dieses Problem, das mich denken lässt, dass ich etwas missverstanden habe.

Soweit ich weiß, hat das Element keine Auswirkungen, aber es ermöglicht das Hinzufügen von Stilen.

Allerdings, versuchen, dies zu tun:

<span dir="rtl"> some text that should be rtl'ed </span>

Das scheint bei mir nicht zu funktionieren (das Verzeichnis hat keine Wirkung).

Die Verwendung eines <div dir="rtl"> hingegen funktioniert problemlos.

Und warum funktioniert das <span> nicht? Soweit ich das verstanden habe, verwende ich <span> für genau diesen Zweck: zum Hinzufügen von Styling. Es funktioniert gut, wenn ich es verwenden, um Farbe hinzufügen... warum nicht für diese?

Vielen Dank für jeden Einblick! Edan

P.S. Nach einigen Versuchen habe ich außerdem festgestellt, dass, wenn ich den Text mit <p> (innerhalb des <span>) umschließe, das Verzeichnis tut wirksam werden. Aber warum sollte ich in diesem Fall nicht einfach <p dir="rtl"> verwenden... die ganze Idee ist, dass ich nicht wollen irgendwelche Elemente, nur um etwas zu gestalten.

Answer 1

dir wirkt sich auf einen Bereich aus, aber ein Bereich wird nicht wie erwartet rechts ausgerichtet, sondern nur sein Inhalt.
Sie sehen die Wirkung für span Wenn Sie ihn mit einem Punkt abschließen, wird der Punkt auf der linken Seite und nicht auf der rechten Seite platziert.
Div ist ein display:block Element, d. h. es füllt die gesamte Breite aus - deshalb kann der Text darin ausgerichtet werden. Span es display:inline Er steht also im Text, ähnlich wie ein Brief (auf eine vereinfachte Art und Weise).
(Übrigens wird es als ungültig angesehen, eine block Element innerhalb eines inline Element)

Hier ist eine funktionierende Demo. Beachten Sie, dass das letzte Div ganz rechts ist:

Test right to left, div and span: <br />
<span>(span)  Hello World!</span> <br />
<span dir='rtl'>(span rtl)  Hello World!</span>
<div>(div) Hello World!</div>
<div dir='rtl'>(div rtl) Hello World!</div>

Answer 2

Der Unterschied besteht darin, dass span ist ein Inline-Element, und dir gilt nicht für Inline-Elemente (genauso wie height und position nicht gelten). Der Grund, warum es mit div und so weiter funktioniert, ist, dass dies Blockelemente sind. Sie möchten also ein Blockelement für die Einstellung Ihrer Textrichtung verwenden.