为什么我看不到HTML 5 <dialog>？

这里是我的Facelets文件：为什么我看不到HTML 5 <dialog>？

<!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>

我在浏览器中看到的只是

Place your content here!

当我检查该文件的来源，我在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文件？但目前，我看不到应该在对话框标签中的内容？

来源

2013-03-18 Koray Tugay

你使用什么浏览器？ – 2013-03-18 22:03:33

@TimBJames Chrome，最新版本。我也将这个源文件复制到一个.html文件并打开，仍然没有区别。我可以在线查看HTML5内容。 – 2013-03-18 22:05:08

好像是'h：body'不是呈现的，因为HTML中没有''标记 – amphibient 2013-03-18 22:07:46

我从来没有使用过的dialog标签，但检查DOM和风格内置到Chrome浏览器后，它好像默认的元素设置为display: none;

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

所以到您的网页上显示该，你需要设置风格;

dialog{ display: block; }

更新

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

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

来源

2013-03-18 22:11:22

很好的答案，谢谢。有效。但是，当我尝试

对不起虚假信息。 dialog {display：block;}工作，只有IntelliJ抱怨它。浏览器很好用。 – 2013-03-18 22:22:34

是的，你也可以通过类添加'display'风格。或者我会认为它会是'open =“open”' – 2013-03-18 22:32:27

使用dialog元素的open属性上

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

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

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

另外请注意，这个功能是不是在这个时候所有浏览器。例如。在Chrome中，它需要启用chrome：// flags /＃enable-experimental-web-platform-features。

（这是蒂姆·B·詹姆斯答案的重编辑版本）。

来源

2013-09-19 19:53:26

为什么我看不到HTML 5 <dialog>？

回答

相关问题