Question

我正在使用codeigniter，for循环中的任何数据都没有应用CSS。该文件正确指向，因为所有其他css工作正常，但我无法在任何地方找到解决方案

HTML：

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE = html>
<html lang="en">
<head>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url('/assets/css/home.css')?>">
     <title>Spill.It</title>

</head>
<body>
    <header>
    <div id="gifLogo">
        <img src="<?php echo base_url('/assets/images/homelogo.gif')?>" width="100%" alt="Spill.It Logo">
     </div>
     </header>
<!-- Foreach loop to print all messages from the user. -->
<?php foreach ($messages as $row): ?>
    <div id=messageDisplay>
    <?php if ($row->user_username == null){
        echo '<p>Nothing has been spilt here yet sorry!</p>';
        }?>
    <h1><?php echo $row->user_username;?> : </h1><p><?php echo $row->text;?></p>
    <p id="time"> Posted At :<?php echo $row->posted_at;?></p>

    </div>  
<?php endforeach ?>
</div>
</body>
</html>

CSS（由于我的css文件非常混乱，我还没有将所有css包含在循环内的部分中）：

#messageDisplay {
    text-align: center;
    padding-left: 10em;
    padding-right: 10em;
    border: 1px solid #4099ff;
    border-radius: 6px;
    box-shadow: 0 0 8px #4099ff;
    margin: 20px;
padding: 5px;   
}
#time {
    font-size: 2px;
}

Answer 1

ID后缺少引号，将其更改为

<div id="messageDisplay">

如果您需要使用相同的CSS设计多个元素，请使用类。 DOM中的ID必须是唯一的

Answer 2

在您的代码中，您将重复CSS ID。 CSS ID可以在整个页面中使用一次，因为ID必须是唯一的。

您应该使用类。

CSS

.messageDisplay {
    text-align: center;
    padding-left: 10em;
    padding-right: 10em;
    border: 1px solid #4099ff;
    border-radius: 6px;
    box-shadow: 0 0 8px #4099ff;
    margin: 20px;
    padding: 5px;   
 }
.time {
    font-size: 2px;
 }

PHP

 <div class="messageDisplay"> </div>

Answer 3

doctype应该像这样改变

<!DOCTYPE html>

加载codeigniter资产应该像

href="<?php echo base_url() ;?>assets/css/home.css"

所以文件夹结构将是

application
assets
    - css
        - home.css
system
index.php
.htaccess

并且在体内，

使用'或"

检查您的代码是否打开和关闭。（Cz代码中有额外的</div>）

<body>
    <header>
        <div id="gifLogo">
            <img src="<?php echo base_url(); ?>assets/images/homelogo.gif" width="100%" alt="Spill.It Logo">
        </div>
     </header>
    <!-- Foreach loop to print all messages from the user. -->
    <?php foreach ($messages as $row): ?>
        <div id= "messageDisplay">
            <?php 
            if ($row->user_username == null)
            {
                echo '<p>Nothing has been spilt here yet sorry!</p>';
            }
            ?>
            <h1><?php echo $row->user_username;?> : </h1><p><?php echo $row->text;?></p>
            <p id="time"> Posted At :<?php echo $row->posted_at;?></p>
        </div>  
    <?php endforeach ?>
    <!-- </div> -->
</body>

如果使用PHP，CSS不适用

3 个答案: