CSS在PHP MYSQL的子菜单菜单上不起作用

Question

I am trying to make a vertical drop-down menu with sub-menus, for example:

1-
 1-
 2-
  1-
3- 

I've come up with the function below, but the CSS is not being applied even though it is defined on the page using the following:

<link href="estilo.css" rel="stylesheet" type="text/css" media="screen" />

What am I doing wrong?

function display_menus($menuIdPai = 0) {
    $query = mysql_query("SELECT * FROM menu WHERE menuIdPai = ".$menuIdPai) or die(mysql_error());
    if (mysql_num_rows($query) > 0) {
        echo "<ul>";
        while ($row = mysql_fetch_array($query)) {
            echo "<li> <a href='percentagem.php'>".$row['id'].$row['menuNome']."</a>";
            display_menus($row['menuId']);
            echo "</li>";
        }
        echo "</ul>";
    }
}

<ul id="nav"> 
    <?php display_menus(); ?>
</ul>

ul {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 150px;
}
ul li {
    position: relative;
}
li ul {
    position: absolute;
    left: 149px;
    top: 0;
    display: none;
}
ul li a {
    display: block;
    text-decoration: none;
    color: #E2144A;
    background: #fff;
    padding: 5px;
    border: 1px solid #ccc;
}
li:hover ul {
    display: block;
}

Answer 1

The CSS is not being applied because your HTML output is incorrect. In the following code:

<ul id="nav"> 
    <?php display_menus(); ?>
</ul>

the call to display_menus() produces its own <ul>...</ul> tags, so you end up with:

<ul id="nav"><ul> ...
</ul></ul>

This is, of course, not valid HTML. One solution to this is to skip the <ul>...</ul> tags in the HTML:

<?php display_menus(); ?>

and adjust display_menus() to output the id="nav" attribute only to the root menu (when $menuIdPai == 0 ):

function display_menus($menuIdPai = 0) {

/* Added $id variable: */

    $id = ($menuIdPai == 0 ? ' id="nav"' : ''); /* Note space before id */

    $query = mysql_query("SELECT * FROM menu WHERE menuIdPai = ".$menuIdPai) or die(mysql_error());
    if (mysql_num_rows($query) > 0) {

/* Added $id here: */

        echo "<ul$id>";

        while ($row = mysql_fetch_array($query)) {
            echo "<li> <a href='percentagem.php'>".$row['id'].$row['menuNome']."</a>";
            display_menus($row['menuId']);
            echo "</li>";
        }
        echo "</ul>";
    }
}

Note that you will also produce incorrect HTML if $row['id'] or $row['menuNome'] happens to contain < or & characters. You should probably escape the latter with htmlspecialchars($row['menuNome']) . Probably not the first, depending on what kind of values you have for the id 's.

Note also that the MySQL extension is deprecated and no longer maintained. You should be using MySQLi or PDO these days.