jsf_inaction4 例子和项目之间的比较,-css的定义

在第八章的例子里面的页面 login。jsp 页面包括了<head><title><body>一个完整的页面而在项目中通常的方法

是直接继承一个模板,直接对form进行编写

 通常在项目中都是定义了css 通过制定styleclass来代替页面中的font 标签等

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>

<f:view>
<html>
<head>
  <title>
    <h:outputText value="ProjectTrack"/>
  </title>
</head>

<body>

<h:form>

<table cellpadding="0" cellspacing="0">
  <tr>
   <td>
     <h:graphicImage url="/images/logo.gif" alt="Welcome to ProjectTrack"
                      title="Welcome to ProjectTrack" width="149" height="160"/>
   </td>
   <td>
     <table cellpadding="5" cellspacing="3">
       <tr>
         <td colspan="2">
           <font face="Arial, sans-serif" size="4" style="font-size: 26pt">
             <h:outputText value="ProjectTrack"/>
           </font>

    <h:outputText value="ProjectTrack" styleClass="login-heading"/>
         </td>
       </tr>
       <tr>
         <td>
           <h:outputLabel for="userNameInput">
             <h:outputText value="Enter your user name:"/>
           </h:outputLabel>
         </td>
         <td>
           <h:inputText id="userNameInput" size="20" maxlength="30"/>
         </td>
       </tr>
       <tr>
         <td>
           <h:outputLabel for="passwordInput">
             <h:outputText value="Password:"/>
           </h:outputLabel>
         </td>
         <td>
           <h:inputSecret id="passwordInput" size="20" maxlength="20"/>
         </tr>
       </tr>
       <tr>
         <td/>
         <td>
           <h:commandButton action="success" title="Submit"
                            image="#{facesContext.externalContext.requestContextPath}/images/submit.gif"/>
       </tr>
     </table>
    </td>
  </tr>
</table>

</h:form>

</body>
</html>
</f:view>

 在css中可以写成

.login-heading {
  font-family: Arial, sans-serif;
  font-size: 26pt;
  font-weight: normal;
  text-align: left;
}

并在页面中的head中间加上  <link rel="stylesheet" type="text/css" href="stylesheet.css"/>

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值