CSS显示属性在移动浏览器中不起作用

Question

http://phoenixchange.com/test/170518_TextTest.html 处的文档经过验证，并在“大多数”浏览器中按预期显示，但在移动 Safari 等浏览器中仍不显示。 （请参阅下面的编辑 8）谁能解释这个以及如何解决？

CSS

.hideaway {
    font-family: arial;
    font-style: italic;
    }
.hiddentxt {
    white-space: pre-wrap;
    letter-spacing: 0.1em;
    }
.hideaway .hiddentxt {
    display: none;
    }
.hideaway:hover .hiddentxt {
    display: inline;
    color: white;
    font-family: times;
    font-weight: normal;
    background: blue;
    }

HTML <p>Accusantium doloremque..odit aut fugit.<span class="hideaway"><br><span class="link normal">[more]</span> <span class="hiddentxt"><br> Interested ? Contact me for details ! </span></span></p>

....

编辑 8 代码 W3C 验证（不必要的 ; 字符，例如 <span class="link normal";> 已删除）。下面的答案只是在这篇文章中的错字。文档正确显示在：
手机：三星、Chrome、Firefox
桌面：Safari、Firefox、IE、Opera
但仍然不是在：
手机：Opera Mini、Safari
Safari mobile 和 Opera Mini 显然都是重要的移动浏览器，所以我真的希望任何代码都可以在这些浏览器上工作（即使用“当前千禧年”浏览器）。我没有成功找到对它们不起作用/在“当前千年”（移动）浏览器的安全 html/css 子集上不起作用的特定信息。

Answer 1

<span class="hideaway" 缺少 >

这就是为什么您应该始终使用空格和编码程序（而不是记事本）！

.hideaway {
    font-family: arial;
    font-style: italic;
    }
.hiddentxt {
    white-space: pre-wrap;
    letter-spacing: 0.1em;
    }
.hideaway .hiddentxt {
    display: none;
    }
.hideaway:hover .hiddentxt {
    display: inline;
    color: white;
    font-family: times;
    font-weight: normal;
    background: blue;
    }

<p>
    Accusantium doloremque..odit aut fugit.
    <span class="hideaway">
        <br>
        <span class="link normal";>
            [more]
        </span> 
        <span class="hiddentxt">
            <br> 
            Interested ?  Contact me for details ! 
        </span>
    </span>
</p>

在https://drivenotepad.github.io/编辑和检查代码

You could use the title attribute

title 属性指定有关元素的额外信息。

当鼠标移到元素上时，该信息通常显示为工具提示文本。

<p title="Interested ?  Contact me for details !">[more]</p>

一旦他们将鼠标悬停在带有标题的元素上，这将显示更多信息。