Html 使用CSS显示错误消息的警报框

Html 使用CSS显示错误消息的警报框,html,css,Html,Css,我在网站上创建了一个登录表单,在表单顶部创建一个警报框时遇到了问题,在服务器端验证和清理用户输入后,警报框应该会显示错误消息。问题是当页面加载时,它会显示警报框,而我希望它只在显示错误消息时显示。请帮忙 HTML部分 <!DOCTYPE html> <html> <head> <title>Login Form</title> <link href="style.css" rel="stylesheet" type="te

我在网站上创建了一个登录表单,在表单顶部创建一个警报框时遇到了问题,在服务器端验证和清理用户输入后,警报框应该会显示错误消息。问题是当页面加载时,它会显示警报框,而我希望它只在显示错误消息时显示。请帮忙

HTML部分

<!DOCTYPE html>
<html>
<head>
  <title>Login Form</title>
  <link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>

<div class="form">

<span class="info">
<?php
        echo
            $fNameErr;
            $lNameErr;
            $emailErr;

?>
</span>


<br>

    <ul class="tab-group">
        <li class="tab active"><a href="#signup">Sign Up</a></li>
        <li class="tab"><a href="login.php">Log In</a></li>
    </ul>

<div class="tab-content">
<h1>Sign Up for Free</h1>


                <form action="signup.php" method="post" autocomplete="off">

                    <div class="top-row">
                        <div class="field-wrap">
                            <label>
                                <span class="req"></span>
                            </label>
                            <input placeholder="Firstname*" type="text" value="<?php echo $firstname;?>" required autocomplete="off" name='firstname' />
                        </div>

                        <div class="field-wrap">
                            <label>
                                <span class="req"></span>
                            </label>
                            <input placeholder="LastName*" type="text" value="<?php echo $lastname;?>" required autocomplete="off" name='lastname' />
                        </div>
                    </div>

                    <div class="field-wrap">
                        <label>
                            <span class="req"></span>
                        </label>
                        <input placeholder="Email Address*" type="email" value="<?php echo $email;?>" required autocomplete="off" name='email' />
                    </div>

                    <div class="field-wrap">
                        <label>
                            <span class="req"></span>
                        </label>
                        <input placeholder="Set A Password*" type="password"required autocomplete="off" name='password'/>
                    </div>

                    <button type="submit" class="button button-block" name="register">Register</button>

                </form>



</div> <!-- /form -->
 </div> 

</body>
</html>

试试这个。如果不起作用,也给我们看看你的php代码
<span class="info">
<?php
        echo
            $fNameErr;
            $lNameErr;
            $emailErr;

?>
</span>
试试这个。如果不起作用,也给我们看看你的php代码
<span class="info">
<?php
        echo
            $fNameErr;
            $lNameErr;
            $emailErr;

?>
</span>
尝试将此更改为下面的格式。让我知道进展如何

<?php
if(isset($fnameErr) || isset($lNameErr) || isset($emailErr)){
    echo "<span class='info'>";
    echo $fNameErr . $lNameErr . $emailErr;
    echo "</span>"
}
?>

尝试将此更改为下面的格式。让我知道进展如何

<?php
if(isset($fnameErr) || isset($lNameErr) || isset($emailErr)){
    echo "<span class='info'>";
    echo $fNameErr . $lNameErr . $emailErr;
    echo "</span>"
}
?>

我假设您只希望在这些变量具有某种值时显示,否则它们将为空。在这种情况下,只输出这个HTML元素是非常容易的。也许是这样的:

<?php if(isset($fnameErr) || isset($lNameErr) || isset($emailErr)){
  echo
    "<span class='info'>"
    $fNameErr;
    $lNameErr;
    $emailErr;
    "</span>";
} ?>

我假设您只希望在这些变量具有某种值时显示,否则它们将为空。在这种情况下,只输出这个HTML元素是非常容易的。也许是这样的:

<?php if(isset($fnameErr) || isset($lNameErr) || isset($emailErr)){
  echo
    "<span class='info'>"
    $fNameErr;
    $lNameErr;
    $emailErr;
    "</span>";
} ?>
我认为
..
也需要有条件地可见/隐藏,现在它将显示一个空框(如果
.info
被设置为类似于一个框)我认为
..
也需要有条件地可见/隐藏,现在它将显示一个空框(如果
.info
被设置为类似于一个框)