Question

我正在设计一个网站，我希望在所有网页中都包含Navbar，问题是每当我在navbar标记内写ui:composition代码而不是bootstrap时} 熄灭。没有这个标签，一切正常。

工作代码

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core" xml:lang="en" lang="en">
<h:head>


    <title>JSF 2.x Page</title>
    <meta http-equiv="keywords" content="enter,your,keywords,here" />
    <meta http-equiv="description"
        content="A short description of this page." />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

    <h:outputStylesheet library="css" name="black.css"  />
    <h:outputStylesheet library="css" name="bootstrap.css"  />

    <h:outputScript library="js" name="bootstrap.js" />
    <h:outputScript library="js" name="bootstrap.min.js" />

</h:head>
<h:body>

        <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="#">My Task</a>
            </div>

            <button class="btn btn-success navbar-btn">Projects</button>
            <button class="btn btn-success navbar-btn">Objects</button>
            <button class="btn btn-success navbar-btn">Properties</button>
            <button class="btn btn-success navbar-btn">Property Types</button>

        </div>
        </nav>

</h:body>
</html>

但是使用ui:composition，bootstrap无法正常工作

    <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core" xml:lang="en" lang="en">
<h:head>
    <title>JSF 2.x Page</title>
    <meta http-equiv="keywords" content="enter,your,keywords,here" />
    <meta http-equiv="description"
        content="A short description of this page." />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />

    <h:outputStylesheet library="css" name="black.css"  />
    <h:outputStylesheet library="css" name="bootstrap.css"  />

    <h:outputScript library="js" name="bootstrap.js" />
    <h:outputScript library="js" name="bootstrap.min.js" />

</h:head>
<h:body>
<ui:composition>
        <nav class="navbar navbar-inverse">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="#">My Task</a>
            </div>

            <button class="btn btn-success navbar-btn">Projects</button>
            <button class="btn btn-success navbar-btn">Objects</button>
            <button class="btn btn-success navbar-btn">Properties</button>
            <button class="btn btn-success navbar-btn">Property Types</button>

        </div>
        </nav>
</ui:composition>

</h:body>
</html>

Answer 1

ui：composition标签用于通过模板＆＃39;模板引用模板。属性如：

<ui:composition template="template.xhtml">

模板只是包含一个或多个<ui:insert>的常规faces文件带有name属性的标记，您可以使用<ui:define>标记使用模板从文件中引用该标记。例如，如果您的模板包含：

<ui:insert name="top">

比您可以从<ui:composition>标记中的其他文件引用它，如：

<ui:define name="top">

生成的html将是从模板创建的html，只有<ui:define>部分被<ui:insert>标记中生成的任何html替换为...... 所以，如果没有模板，你就不会创建正确的html，没有头部没有身体..

Bootstrap无法在ui组合标签JSF

1 个答案: