1
私はJSFページに書き換えしたいHTML5を持っている:書き換えHTML5 JSFページにページ
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=1,initial-scale=1,user-scalable=1" />
<title>Insert title here</title>
<link href="http://fonts.googleapis.com/css?family=Lato:100italic,100,300italic,300,400italic,400,700italic,700,900italic,900" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="resources/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="resources/css/styles.css" />
</h:head>
<h:body>
<section class="container login-form">
<section>
<form method="post" action="" role="login">
<img src="logo.png" alt="" class="img-responsive" />
<div class="form-group">
<input type="email" name="email" required="true" class="form-control" placeholder="Email address" />
</div>
<div class="input-group">
<input type="password" name="password" required="true" class="form-control" placeholder="Password" />
<span class="input-group-btn">
<button class="btn btn-default" type="button" id="tooltip" data-toggle="tooltip" data-placement="top" title="Forgot password ?">?</button>
</span>
</div>
<button type="submit" name="go" class="btn btn-primary btn-block">Login Now</button>
</form>
</section>
</section>
</h:body>
</html>
私はこれを試してみました:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:j="http://xmlns.jcp.org/jsf/passthrough">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=1,initial-scale=1,user-scalable=1" />
<title>Insert title here</title>
<link href="http://fonts.googleapis.com/css?family=Lato:100italic,100,300italic,300,400italic,400,700italic,700,900italic,900" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" type="text/css" href="resources/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="resources/css/styles.css" />
</h:head>
<h:body>
<section class="container login-form">
<section>
<h:form>
<img src=logo.png" alt="" class="img-responsive" />
<div class="form-group">
<h:inputText j:type="email" j:name="email" required="true" styleClass="form-control" j:placeholder="Email address" value="#{login.user}"/>
</div>
<div class="input-group">
<h:inputSecret j:type="password" j:name="password" required="true" styleClass="form-control" j:placeholder="Password" value="#{login.password}" autocomplete="off"/>
<span class="input-group-btn">
<button class="btn btn-default" type="button" id="tooltip" data-toggle="tooltip" data-placement="top" title="Forgot password ?">?</button>
</span>
</div>
<h:commandButton type="submit" j:name="go" styleClass="btn btn-primary btn-block" action="#{login.userAuthanticate}">Login Now</h:commandButton>
</h:form>
</section>
</section>
</h:body>
</html>
私はHTML5を使用したいbecasue私はxmlns:j="http://xmlns.jcp.org/jsf/passthrough"
を追加しました。私がh:form
を追加すると、CSSのスタイルが完全に台無しになってしまいます。 JSFタグでこのページを書き換える正しい方法は何ですか?