将CSS应用于表单

时间:2010-03-05 03:10:57

标签: html css forms

我无法将CSS应用于下面的函数。是因为它是一个表单还是因为它使用了dl,dt和dd标签?

提前致谢,

约翰

function show_loginform($disabled = false)
{

    echo '<form name="login-form" id="login-form" method="post" action="./index.php"> 

  <div class=\"logintitle\">Please login</div> 
  <dl class=\"usernamefield\"> 
    <dt class=\"siteadd\"><label title="Username">Username: </label></dt> 
    <dd class=\"siteadd\"><input tabindex="1" accesskey="u" name="username" type="text" maxlength="30" id="username" /></dd> 
  </dl> 
  <dl class=\"siteadd\"> 
    <dt class=\"siteadd\"><label title="Password">Password: </label></dt> 
    <dd class=\"siteadd\"><input tabindex="2" accesskey="p" name="password" type="password" maxlength="15" id="password" /></dd> 
  </dl> 
  <ul> 
    <li><a href="http://www...com/sandbox/register.php" title="Register">Register</a></li> 
    <li><a href="http://www...com/sandbox/lostpassword.php" title="Lost Password">Lost password?</a></li> 
  </ul> 
  <p class=\"siteadd\"><input tabindex="3" accesskey="l" type="submit" name="cmdlogin" value="Login" ';
    if ($disabled == true)
    {
        echo 'disabled="disabled"';
    }
    echo ' /></p></form>';


}

3 个答案:

答案 0 :(得分:4)

您的代码中有一个转义错误。仅显示一个摘录:

  echo ' ... <div class=\"logintitle\">Please login</div>  ... ';

您使用'但后退",这将导致\"打印给用户。使用"作为主要引号时,您不必转义'。这可能是您的浏览器的问题,而不是正确识别您的div,从而不应用CSS。

附录:

当回显大部分时(如前所述,最好使用模板系统,例如smarty),你可以关闭并重新打开你的php标签以便更好地阅读:

function show_loginform($disabled = false)
{

?>
<form name="login-form" id="login-form" method="post" action="./index.php"> 

  <div class="logintitle">Please login</div> 
  <dl class="usernamefield"> 
    ...
<?php
   if(true)
   {
      echo 'foobar';
   }
?>

   ...
  </p></form>
<?php

} // function end

你可以让大多数语法荧光笔崩溃吗;)

答案 1 :(得分:0)

除了以这种方式混合HTML和PHP之外,您的代码足够有效。我能够将CSS应用于上面的确切代码。问题出在你的CSS中。

答案 2 :(得分:0)

这不能解决您的问题,而是未来编程的提示:

没有必要将$ disabled与true进行比较,因为$ disabled已经是布尔值。


if ($disabled == true){
    echo 'disabled="disabled"';
}

以下显示了对布尔类型的更多理解:


if ($disabled){
    echo 'disabled="disabled"';
}

发布您的CSS,可以更轻松地帮助您解决原始问题......