使用 <span>添加方向(dir =“rtl") [英] Using <span> to add a direction (dir = "rtl")

问题描述

我是 html 新手，经常使用希伯来语.我遇到了这个问题，这让我觉得我误会了什么.

I'm new to html, and use hebrew a lot. I came across this problem, which makes me think I'm misunderstanding something.

据我所知，该元素没有效果，但它允许添加样式.

As for as I know, the element has no effect, but it does allow adding style.

但是，尝试这样做:

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

似乎对我不起作用(目录无效).

Doesn't seem to work for me (the dir has no effect).

另一方面，使用 <div dir="rtl"> 效果很好.

Using a <div dir="rtl">, on the other hand, works fine.

那么..为什么不是 <span>在职的?就我的理解而言，我使用的是 <span>正是为了它的目的:添加样式.当我用它来添加颜色时效果很好......为什么不这样做?

So.. why isn't the <span> working? As far as my understanding goes, I'm using <span> for exactly its purpose: adding styling. It works fine when I use it to add color... why not for this?

感谢您的任何见解！伊丹

Thanks for any insights! Edan

附言经过一些测试，我还发现如果我用 <p> 将文本括起来，(在 <span> 内)，则目录 确实 生效.但在那种情况下，我为什么不直接使用 <p dir="rtl">...整个想法是我不想要任何元素，只是为了设计一些样式.

P.S. After some testing, I also discovered that if I surround the text with <p> (inside the <span>), then the dir does take effect. But in that case, why wouldn't I just use <p dir="rtl">... the whole idea is that I don't want any elements, just to style something.

推荐答案

dir 对 span 有影响，但 span 不会像您预期的那样右对齐，只会对齐其内容.
如果以点结尾，您将看到 span 的效果 - 点将放置在左侧，而不是右侧.
Div 是一个 display:block 元素，这意味着它填充了整个宽度 - 这就是文本可以在其中对齐的原因.Span 是 display:inline，因此它位于文本中，类似于字母(以简单的方式).
(顺便说一句 - 在 inline 元素中包含 block 元素被认为是无效的)

dir has an effect on a span, but a span will not be aligned to the right as you expect, only its content.
You will see the effect for span if you end it with a dot - the dot will be placed on the left side, and not on the right.
Div is a display:block element, meaning it fills the whole width - that's why text can be aligned in it. Span is display:inline, so it's sitting in the text, similar to a letter (in a simplistic way).
(by the way - it's considered invalid to have a block element inside an inline element)

这是一个工作演示.请注意最后一个 div 位于右侧:

Here's a working demo. Notice the last div is far on the right:

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>

这篇关于使用 &lt;span&gt;添加方向(dir =“rtl")的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！