Fatal编程技术网
  • html/
  • Html Chrome从右到左段落存在问题

Html Chrome从右到左段落存在问题

html google-chrome

Html Chrome从右到左段落存在问题,html,google-chrome,right-to-left,packet,paragraph,Html,Google Chrome,Right To Left,Packet,Paragraph,我最近开始注意到这个Chrome问题：从右到左div中的表格单元格中的某些段落是从左到右随机显示的。服务器速度越慢，发生的情况就越多（我无法在本地重现问题），问题段落在刷新页面时会发生变化 下面是一段HTML，演示了该问题： <html> <body> <div style="direction:rtl;"> <table><tr><td> <p> long paragraph <

我最近开始注意到这个Chrome问题：从右到左div中的表格单元格中的某些段落是从左到右随机显示的。服务器速度越慢，发生的情况就越多（我无法在本地重现问题），问题段落在刷新页面时会发生变化

下面是一段HTML，演示了该问题：

<html>
  <body>
    <div style="direction:rtl;">
      <table><tr><td>

<p>
long paragraph
</p><p>
another long paragraph
</p><p>
 . . .
 . . .
</p><p>
last long paragraph
</p>

      </td></tr></table>
    </div>
  </body>
</html>



长段落


又是一长段


. . .
. . .


最后一段
您可以在此处看到现场演示： （别忘了刷新几次）

有什么解决办法吗

编辑：

问题是可重现的。您仍然需要一台服务器（可能是本地的），您可以通过使用“开发者工具”（F12）在“网络”选项卡/“在线”子选项卡中创建并使用“节流阀”（例如，30 Kb/s，延迟为0），将Chrome设置为模拟慢速连接

也不需要HTML“表”

显然，问题发生在包边界的段落中。请参阅以获取捕获这种现象的视频。

经过几天的努力，我找到了一个解决方法，即在加载所有内容后本地刷新所有段落：

<html>
  <head>
    <script>
    function refreshParagraphs() {
      var paragrahpContent;
      var paragraphs = document.getElementsByTagName("P");
      for (i = 0; i < paragraphs.length; i++) {
        paragrahpContent = paragraphs[i].innerHTML;
        paragraphs[i].innerHTML = paragrahpContent;
      }
    }
    </script>
  </head>
  <body onload="refreshParagraphs();">
    <div style="direction:rtl;">

<p>
long paragraph
</p><p>
another long paragraph
</p><p>
 . . .
 . . .
</p><p>
last long paragraph
</p>

    </div>
  </body>
</html>


函数刷新段落（）{
var paragrahpContent；
var段落=document.getElementsByTagName（“P”）；
对于（i=0；i<段落长度；i++）{
paragrahpContent=段落[i].innerHTML；
段落[i].innerHTML=paragrahpContent；
}
}

长段落


又是一长段


. . .
. . .


最后一段
经过几天的努力，我找到了一个解决方法，在加载所有内容后本地刷新所有段落：

<html>
  <head>
    <script>
    function refreshParagraphs() {
      var paragrahpContent;
      var paragraphs = document.getElementsByTagName("P");
      for (i = 0; i < paragraphs.length; i++) {
        paragrahpContent = paragraphs[i].innerHTML;
        paragraphs[i].innerHTML = paragrahpContent;
      }
    }
    </script>
  </head>
  <body onload="refreshParagraphs();">
    <div style="direction:rtl;">

<p>
long paragraph
</p><p>
another long paragraph
</p><p>
 . . .
 . . .
</p><p>
last long paragraph
</p>

    </div>
  </body>
</html>


函数刷新段落（）{
var paragrahpContent；
var段落=document.getElementsByTagName（“P”）；
对于（i=0；i<段落长度；i++）{
paragrahpContent=段落[i].innerHTML；
段落[i].innerHTML=paragrahpContent；
}
}

长段落


又是一长段


. . .
. . .


最后一段
无法为我重现问题工作（即，我可以看到问题所在）——尝试刷新并滚动整个页面几次……当我切换到速度较慢的wifi网络时，我看到了它。那太疯狂了。您是否尝试过使用html属性dir=“rtl”而不是
direction
css属性？我怀疑这会解决问题，但也许值得一试。它只是在表格单元格中，还是其他嵌套元素也会这样做？是的，我试过了，但没用。事实上，我原来的问题更糟：我实际的网站上有希伯来语（而且必须有表格），随机的从左到右的段落也颠倒了单词中字母的顺序，这使得它无法阅读。我用更多信息编辑了原始帖子。无法为我重现issueWorks（即，我可以看到问题）--尝试刷新和滚动整个页面，几次……当我切换到较慢的wifi网络时，我看到了它。那太疯狂了。您是否尝试过使用html属性dir=“rtl”而不是
direction
css属性？我怀疑这会解决问题，但也许值得一试。它只是在表格单元格中，还是其他嵌套元素也会这样做？是的，我试过了，但没用。事实上，我原来的问题更糟：我实际的网站上有希伯来文（而且必须有表格），而且随机的从左到右的段落也颠倒了单词中字母的顺序，这使得它无法阅读。我编辑了原始帖子，提供了更多信息。是的，我注意到刷新在大多数情况下可以纠正问题……是的，我注意到刷新可以纠正问题，大多数情况下。。。