为啥 PHP 会弄乱我的 CSS？

Posted 2023-03-06

【中文标题】为啥 PHP 会弄乱我的 CSS？

【英文标题】：Why is PHP messing with my CSS?为什么 PHP 会弄乱我的 CSS？

【发布时间】：2015-12-13 04:23:45

【问题描述】：

我创建了我的联系表单，并且一直在为 CSS 使用引导程序。在添加 php 之前，我的联系表单看起来很棒，所有字段都对齐并且居中。现在我已经输入了我的 PHP 联系表，它看起来不一样。字段宽度缩短了，消息框的宽度与其他字段不同，表单在屏幕上的宽度约为 3/8。在我添加 PHP 之前，它是 6 列的宽度并居中，正如您从我的代码中看到的那样。

我是网络开发的新手，我正在努力学习基础知识，因为我认为这将对我未来的职业生涯有所帮助，因此非常感谢任何帮助。另外，我确实有这个托管和直播，所以我的代码肯定有错误。

这是我的 PHP 代码联系表

<form class="form-horizontal" id="contactform" role="form" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" novalidate>
<?php
    if($sent === true) 
        echo "<h2 class='success'>Thanks, your message has been sent successfully</h2>";
     elseif ($hasError === true) 
        echo '<ul class="errorlist">';
        foreach($errorArray as $key => $val) 
            echo "<li>" . ucfirst($key) . " field error - $val</li>";
        
        echo '</li>';
    
?>
<div class="form-group">
    <div class="col-sm-10 col-sm-offset-1 col-md-6 col-md-offset-3">
        <input type="text" id="name" name="name" placeholder="Name" value="<?php echo (isset($name) ? $name : ""); ?>">
    </div>
</div>

然后我在这里有其他字段几乎相同的电话、电子邮件和消息，然后用关闭表单完成。

</form>

这是我的 j 查询脚本

<script type="text/javascript">
jquery(document).ready(function($) 
    $("#contactform").validate(
        rules: 
            name: 
                required: true,
                minlength: 2
            ,
            email: 
                required: true,
                email: true
            ,
            message: 
                required: true
            
        ,
        messages: 
            name: 
                required: "Please enter your name",
                minlength: "Your name seems a bit short"
            ,
            email: 
                required: "Please enter your email address",
                email: "Please enter a valid email address"
            ,
            message: 
                required: "Please enter your message"
            
        
    );
);

【问题讨论】：

您很可能需要全面分析输出 html 并找出缺少的内容。

PHP 不会乱用 CSS。

输出html是什么意思？

@graham 如果您要在浏览器中查看 php 表单上的源代码，然后将其与添加 php 之前的代码进行比较，那么它应该有一些缺失/错误导致这种类型的问题。

【参考方案1】：

你为什么不试试模板语法？您的文本编辑器将以这种方式向您显示更好的语法颜色：

<form class="form-horizontal" id="contactform" role="form" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" novalidate>
<?php if($sent === true): ?>
      <h2 class='success'>Thanks, your message has been sent successfully</h2>
<?php elseif ($hasError === true): ?>
        <ul class="errorlist">
            <?php foreach($errorArray as $key => $val): ?>
                <li><?php echo ucfirst($key); ?>  field error - <?php echo $val; ?></li>            
            <?php endforeach; ?>
        </ul>
<?php endif;?>
<div class="form-group">
    <div class="col-sm-10 col-sm-offset-1 col-md-6 col-md-offset-3">
        <input type="text" id="name" name="name" placeholder="Name" value="<?php echo (isset($name) ? $name : ""); ?>">
    </div>
</div>

【参考方案2】：

您似乎没有正确关闭错误列表。

echo '<ul class="errorlist">';
foreach($errorArray as $key => $val) 
    echo "<li>" . ucfirst($key) . " field error - $val</li>";

echo '</li>';

应该是……

echo '<ul class="errorlist">';
foreach($errorArray as $key => $val) 
    echo "<li>" . ucfirst($key) . " field error - $val</li>";

echo '</ul>';

（注意最后一行，将</li> 更改为</ul>。）

【讨论】：

谢谢马丁。我已经这样做了，但它没有做出任何视觉上的改变