如何在php旁边使用css?

时间:2013-03-05 19:08:29

标签: php html css

我正在尝试从文件夹中获取一些图像并以整洁和可呈现的方式显示它。为此,我使用PHP从文件夹中获取图像。

以下是代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="/custom.css">
<title>Load Images from a folder</title>
</head>
<body>

<?php

$files = glob("*.JPG");
$fileCount = count(glob("*.JPG"));

echo '<ul id = \"gallery\">';
for ($i = ($fileCount -1); $i >= (0); $i--) {
    echo '<li> <img src="' . $files[$i] . '" alt="image" /> </li>';
}
echo '</ul>';

?>
</body>
</html>

与此同时,我使用以下css。 (下面)custom.css文件与(上面)index.php文件位于同一文件夹中。

#gallery li {
    display: inline;
    list-style: none;
    max-width: 250px;
    max-height: 250px;
    float: left;
    margin: 0px 20px 20px 0px;
    text-align: center;
}

但是,它没有用。我得到的图像是一个在另一个下面(每个图像都有一个子弹),而不是像我期望的那样在另一个旁边。

我尝试将css文件重命名为.php,文字为:

<?php "header("Content-type: text/css");" ?>

位于顶部,并使用'id = gallery'标记'li',但也没有帮助。

我在这里缺少什么?

2 个答案:

答案 0 :(得分:2)

display: inline会使元素不符合浮点数,高度/宽度和边距等内容。如果您要使用花车,只需删除display: inline即可。这应该使它们按预期流动。

如果这仍然不起作用,请检查您的浏览器的开发人员工具,以确保您的样式得到应用,并确保它们不会被其他地方的某些其他样式覆盖。< / p>

如果根本没有应用这些样式,请检查以下内容:

  1. 找到了样式表。前导斜杠强制站点从根目录查看。如果那不是您的css文件的位置,则无法找到它。
  2. 您的PHP正在编写正确的HTML。当它们用单引号括起来时,你不需要转义双引号(当用双引号时你也不需要转义单引号)。 id=\"gallery\"id="gallery"不同。

答案 1 :(得分:0)

你的身份证错了,你应该这样:

echo "<ul id='gallery'>";

而不是

echo '<ul id = \"gallery\">';