Question

我正在尝试格式化表格中的链接。我已经为<body>标记内的链接指定了默认格式。它们显示正确。有人指出为什么以下CSS会格式化页面上的所有链接（包括用<table class="links"></table>标记的表格中的那些链接），如<body>标记中所示？我已经阅读了这个网站上的一些帖子以及其他各种关于使用CSS格式化标签内部对象（使用类）的帖子，但我认为还有一些我缺少的基本内容。

body
{
    background-color:#800000;
    color:#FFFFFF;
    font:14px arial,sans-serif;
}
body a:link
{
    color:#FFFFFF; /* unvisited link */
    text-decoration:underline;
    font:11px arial,sans-serif;
}
body a:visited
{
    color:#FFFFFF; /* visited link */
    text-decoration:underline;
    font:11px arial,sans-serif;
}
body a:hover
{
    color:#FFFFFF; /* mouse over link */
    text-decoration:none;
    font:11px arial,sans-serif;
}
body a:active
{
    color:#FFFFFF; /* selected link */ 
    text-decoration:none;
    font:11px arial,sans-serif;
}

table
{
    border-collapse:collapse;
    background-color:#DDDDDD;
    color:#000000;
    font:14px arial,sans-serif;
}
table, td, th
{
    border:1px solid black;
    padding-left: 4px;
    padding-right: 4px;
}
td.header
{
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 1px;
    padding-bottom: 1px;
    font-weight:bold;
}
tr.header
{
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 1px;
    padding-bottom: 1px;
    font-weight:bold;
}
table.links a:link
{
    color:#000000; /* unvisited link */
    text-decoration:underline;
    font:14px arial,sans-serif;
}
table.links a:visited
{
    color:#000000; /* visited link */
    text-decoration:underline;
    font:14px arial,sans-serif;
}
table.links a:hover
{
    color:#000000; /* mouse over link */
    text-decoration:none;
    font:14px arial,sans-serif;
}
table.links a:active
{
    color:#000000; /* selected link */ 
    text-decoration:none;
    font:14px arial,sans-serif;
}

编辑：这是使用样式表的来源。

<?php
    include "../Core/Debug_Start.php";
    include "../Core/Database.php";
    Debug::Out( "Running 'Boat/UpdateBlades.php'" );
    include "User.php";
    include "Blades.php";

    session_start();
    if( !Users::IsUserLoggedIn() )
        header( "location:../index.php" );
?>

<html>
<head>
    <link href="../Styles/Damflask/Style_Damflask.css" rel="stylesheet" type="text/css">
</head>
<body>

<?php
    /////////////////////////////////////////////////////////////

    // returns a full list of all blade sets
    $aBladeSets = Blades::GetAllBladeSets( $database );
    $iNumBladeSets = count( $aBladeSets );
    if( $iNumBladeSets == 0 )
        return;
    $iNumRows = $iNumBladeSets + 1;

    // create the table
    echo( "<table class=\"links\" align=\"center\">" );
    for( $iRowIndex = 0; $iRowIndex < $iNumRows; $iRowIndex++ )
    {
        echo( "<tr>" );
        if( $iRowIndex == 0 )
        {
            // NAME
            echo( "<td class=\"header\">NAME</td>" );

            // AVAILABLE
            echo( "<td class=\"header\">AVAILABLE</td>" );

            // ADDITIONAL INFO
            echo( "<td class=\"header\">INFO</td>" );

            // EDIT / DELETE
            echo( "<td class=\"header\" colspan=\"2\"></td>" );
        }
        else
        {
            // display the blade set
            $iBladeSetIndex = $iRowIndex - 1;
            $bladeSet = $aBladeSets[ $iBladeSetIndex ];

            // NAME
            echo( "<td>" . $bladeSet->GetName() . "</td>" );

            // AVAILABLE
            echo( "<td>" );
            if( $bladeSet->IsAvailable() )
                echo( "Yes" );
            else
                echo( "No" );
            echo( "</td>" );

            // ADDITIONAL INFO
            echo( "<td>" . $bladeSet->GetAdditionalInfo() . "</td>" );

            // EDIT
            echo( "<td><a class=\"tablelink\" href=\"UpdateBlades.php?BladesID=" . $bladeSet->GetID() . "\">EDIT</a></td>" );

            // DELETE
            echo( "<td><a class=\"tablelink\" href=\"DeleteBladeSet.php?BladesID=" . $bladeSet->GetID() . "\">DELETE</a></td>" );
        }
        echo( "</tr>" );
    }
    echo( "<tr><td colspan=\"5\"><a href=\"AddBlades.php\">ADD A NEW BLADE SET</a></td></tr>" );
    echo( "</table>" );

    /////////////////////////////////////////////////////////////

    $database->CloseConnection();
    include "../Core/Debug_End.php"
?>
</body>
</html>

Answer 1

刚刚意识到（4个月后）我没有关闭这个问题。事实证明，body {}和table {}标签之间有一个空格：

body a:active
{
    color:#FFFFFF; /* selected link */ 
    text-decoration:none;
    font:11px arial,sans-serif;
}
 <--- A space.
table
{
    border-collapse:collapse;
    background-color:#DDDDDD;
    color:#000000;
    font:14px arial,sans-serif;
}

通过删除空格，它可以按预期工作。

Answer 2

您的CSS中没有正确定位它们，这就是原因！

table.links .tablelink {
 STYLES HERE
}

使用您的：

是使用当前标记定位它们的正确方法

table.links a:link {

如果您要按照自己的方式定位链接，则不需要.tablelink的类名称，只需要额外的标记，您只需要：

使用.tablelink类的好处就是在CSS中设置这些链接的所有内容：

.tablelink {
STYLES HERE
}

您也不需要使用：

table.links {

你可以使用：

.links {

为什么表中的链接引用了一个采用主标记中链接样式的类？

2 个答案: