Question

我有......

ul {
    list-style: none;
}

..在我的ul上，点仍在那里。

从Chrome检查员可以看出，它是最顶级的风格......

为什么这不会像通常那样起作用？

我正在使用react ...

创建列表

class Shift extends React.Component {

    render() {
        return (
            <li>
               ...
            </li>
        );
    }
};

class CommentList extends React.Component {

    render() {

        var nodes = this.props.data.map(function (s) {

            return (
                <Shift key={s.sid} />
            );
        });

        return (
            <ul>
                {nodes}
            </ul>
        );
    }
};

Answer 1

您需要设置

list-style-type: none;

https://developer.mozilla.org/de/docs/Web/CSS/list-style-type

＆＃34;列表样式＆＃34;是简写，你需要添加其他值，在你可以做的情况下

list-style: none outside none;

Answer 2

在另一个CSS文件中，我有......

ul li:before {
   content: '\2022 \00a0 \00a0 \00a0';
}

所以这并不是压倒一切的列表风格，但它仍然打破了它。

Answer 3

试试这个......

$query = $_GET['yearPick'];
$q = "SELECT * FROM superbowl WHERE YearPlayed = $query ORDER BY YearPlayed DESC";      
$result = @mysqli_query ($dbcon, $q); // Run the query.
if ($result) { // If it ran OK, display the records.

// Fetch and print fields into page:
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
    $win = $row[Winner] . ".jpg"; //append .jpg to winning team name which is the name of pic to be displayed
    $lose = $row[Loser] . ".jpg"; //append .jpg to losing team name which is the name of pic to be displayed
    echo  "<div style='float:left';> <p><img src='images/$win' width='314px' height='272px' alt='winner'></p><p> <b>Year:</b>  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" . $row[YearPlayed] . '</p>';
    echo  "<p> <b>Winner:</b> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" . $row[Winner] . '</p>';
    echo  "<p> <b>Winning QB:</b> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" . $row[WinningQB] . '</p>';
    echo  "<p> <b>Score:</b>  &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" . $row[Score] . '</p></div>';
    echo  "<div style='float:right';><p><img src='images/$lose' width='314px' height='272px' alt='loser'></p><p><b>Superbowl:</b> &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; " . $row[SuperBowl]. '</p>';
    echo  '<b>Loser:</b> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ' . $row[Loser]. '</p>';
    echo  '<b>Losing QB:</b> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ' . $row[LosingQB]. '</p>';
    echo  "<p> <b>City Played:</b> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" . $row[CityPlayed] . '</p></div>';
    }
    mysqli_free_result ($result); // Free up the resources.
} else { // If it did not run OK.
// Public message:
    echo '<p class="error">The current records could not be retrieved. We apologize for any inconvenience.</p>';
    // Debugging message:
    echo '<p>' . mysqli_error($dbcon) . '<br><br />Query: ' . $q . '</p>';
} // End of if ($r) IF.
mysqli_close($dbcon); // Close the database connection.

这样可以确保我们使用ul, li { list-style: none !important; }同时定位ul和li标签使其变得重要，因此我们不会将其与其他样式一起推翻。

列表样式设置为无无效

3 个答案: