Question

我对显示搜索结果的问题感到震惊。这是我的一段代码

<style>
    .main {
        position: absolute;
        font-size: 1.01vw;
        color: Black;
        font-family: Helvetica;
        top: 13.5vw;
        left: 28.4%;
    }
</style>

<style>
    .details {
        position: absolute;
        font: 1.19vw;
        color: Black;
        font-family: Helvetica;
        top: 28%;
        left: 28.4%;
    }
</style>

<?php

$input = $_GET['input'] or die (mysql_error());
$terms = explode(" ", $input);
$query = "SELECT * FROM search WHERE ";

$first = true;

foreach ($terms as $each) {
    if ($first) {
        $query .= "keywords LIKE '%$each%' ";
        $first = false;
    } else {
        $query .= "OR keyword LIKE '%$each%' ";
    }
}

//Connect to Database
mysql_connect("localhost", "root", "");
mysql_select_db("databasem") or die ("database not found");

$query = mysql_query($query) or die (mysql_error());
$numrows = mysql_num_rows($query);

if ($numrows > 0) {
    while ($row = mysql_fetch_assoc($query)) {
        $id = $row['id'];
        $title = $row['title'];
        $description = $row['description'];
        $keywords = $row['keywords'];
        $link = $row['link'];

        echo "<div class=\"main\"><h2><a href='$link' style='text-decoration:none'><b>$title</b></a></h2>$description<br/></div>";
    }
    echo "<br /><br />$numrows Results Found\n";
} else {
    echo "<div class=\"details\">No Results Found <b>'$input'</b> </div>";
}

搜索结果显示在彼此之上，而不是一个接一个地显示。

我是PHP的新手，这是我生命中的第一个程序。我知道编码风格太旧了，并且会在不久的将来尝试改进我的编码风格。如果代码中有某种更新，请更正我。

由于

Answer 1

你的问题是CSS而不是PHP -

.main {
  position: absolute;
  ...
  top:13.5vw;
  left:28.4%;

Absolute positioning表示文字始终显示在屏幕上的完全相同位置 - 因为对于每个结果，您要创建另一个<div>类.main，它只会被写入在顶部。

一般来说，只有在“绝对”必要时才使用position：absolute - 它对于必须位于屏幕上特定位置的导航栏或徽标等有用，但是对于可变数量的文本来说这是有问题的。如果您有列表，请使用inline，block或inline-block以允许浏览器自行传输文本。

我建议：

因为这是你的第一个程序并且猜测你可能刚刚从其他地方复制了CSS，删除了除字体设置之外的所有内容，并且对于你的结果，使用类似的东西来打印每个结果：

echo("<li> <h2>$title</h2> $description </li>");

（将其包含在unordered list - <ul>和</ul> - 围绕while声明。

搜索结果格式

1 个答案: