3

这是我的 Facelets 文件：

<!DOCTYPE html>
<html lang="en"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html">

<h:head>
    <title>Simple JSF Facelets page</title>
</h:head>

<h:body>
    Place your content here!
    <dialog>
        <dt>Sam</dt>
        <dd>Knock, Knock.</dd>
        <dt>Eric</dt>
        <dd>Who's there?</dd>
        <dt>Sam</dt>
        <dd>Justin.</dd>
        <dt>Eric</dt>
        <dd>Justin who?</dd>
        <dt>Sam</dt>
        <dd>Justin time for dinner!</dd>
    </dialog>
</h:body>
</html>

我在浏览器中看到的只是

将您的内容放在这里！

当我检查此文件的源时，我在 chrome 中看到：

<!DOCTYPE html>
<html lang="en"><head>
    <title>Simple JSF Facelets page</title></head><body>
Place your content here!
<dialog>
    <dt>Sam</dt>
    <dd>Knock, Knock.</dd>
    <dt>Eric</dt>
    <dd>Who's there?</dd>
    <dt>Sam</dt>
    <dd>Justin.</dd>
    <dt>Eric</dt>
    <dd>Justin who?</dd>
    <dt>Sam</dt>
    <dd>Justin time for dinner!</dd>
</dialog>
<ul id="javax_faces_developmentstage_messages" title="Project Stage[Development]: Unhandled Messages"></ul></body>
</html>

那么，从源代码来看，它看起来应该是一个有效的 html5 文件？但是目前，我看不到应该在对话框标签中的内容？

4

2 回答 2

9

我以前从未使用过该dialog选项卡，但是在检查了 Chrome 内置的 DOM 和样式之后，似乎默认情况下该元素设置为display: none;

dialog:not([open]){ display: none; }

所以要在你的页面上显示这个，你需要设置样式；

dialog{ display: block; }

更新

此外，您可以在元素上使用open属性dialog

<dialog open>....</dialog>
于 2013-03-18T22:11:22.440 回答
2

在元素上使用open属性dialog

<dialog open>....</dialog>

默认情况下，元素设置为display: none;

dialog:not([open]){ display: none; }

另请注意，此功能目前并非在所有浏览器中都可用。例如，在 Chrome 中，它需要启用 chrome://flags/#enable-experimental-web-platform-features。

（这是 Tim B James 答案的大量编辑版本）。

于 2013-09-19T19:53:26.063 回答