html - 为什么我的表格没有显示边框？

Question

我修改了我的 Site.css 文件，它被 _SiteLayout.cshtml 引用，试图给表格内容一个边框:

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;

    /* added below 4/23/2013 and commented out: border: 0 none; */
    border-color: #600;
    border-width: 0 0 1px 1px;
    border-style: solid;
}

. . .

td {
    padding: 0.25em 2em 0.25em 0em;

    /* added below 4/23/2013 and commented out: border: 0 none;*/
    border-color: #600;
    border-width: 1px 1px 0 0;
    border-style: solid;
    margin: 0;
    padding: 4px;
    background-color: #FFC;
}

我的表格没有显示边框，但是......为什么不呢？

更新

好的，现在，在尝试向表格添加边框之后，突然间 jQuery 不再工作了。所以这是独家新闻:

_SiteLayout.cshtml 引用 .css 文件:

<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />

在那个文件中我现在有:

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;

    /* added below 4/23/2013 and commented out: border: 0 none; 
    border-color: #600;
    border-width: 0 0 2px 2px;
    border-style: solid;*/
    border: 1px solid #600;
}

td {
    padding: 0.25em 2em 0.25em 0em;

    border:1px solid #600;
    margin: 0;
    padding: 4px;
    background-color: #FFC;
}

(省略号表示在 table 和 td 之间省略了其他标签以避免混淆)

我的整个 Default.cshtml 是:

@{
    Layout = "~/_PlatypusLayout.cshtml";
    Page.Title = "Home Page";
}
        <input type="submit" id="submit" value="Get SSCSSETUP.XML" />
        <div id="Platypus_Setup">
        </div>
        <input type="submit" id="submit2" value="Get PlatypusSETUP_000002.XML" />
        <div id="Platypus_Setup2">
        </div>
        <input type="submit" id="submit3" value="Get PlatypusSETUP_000003.XML" />
        <div id="Platypus_Setup3">
        </div>
<script>
    $(document).ready(function () {
        $('#submit').click(function () {
            $.ajax({
                type: "GET",
                url: "DuckbillSETUP.XML",
                dataType: "xml",
                success: function (PlatypusSetupRec) {
                    var Platypussetup = "<table><thead><th>Platypus Number</th><th>Platypus Name</th></thead>";
                    $(PlatypusSetupRec).find('Platypus').each(function () {
                        var PlatypusNum = $(this).find('PlatypusNumber').text();
                        var PlatypusName = $(this).find('PlatypusName').text();
                        Platypussetup += "<tr>";
                        Platypussetup += "<td>" + PlatypusNum + "</td>";
                        Platypussetup += "<td>" + PlatypusName + "</td>";
                        Platypussetup += "</tr>";
                    });
                    Platypussetup += "</table>";
                    $('#Platypus_Setup').append(Platypussetup);
                },
                error: function (xhr) {
                    alert(xhr.status);
                }
            });
            return false;
        });
    });
</script>

表格是在点击第一个按钮时显示，但是由于 Site.css 发生了变化或者因为我在 Chrome 中按下了 Ctrl+R 现在导致点击处理程序失聪或脱钩或否则会以某种方式发生故障...

Answer 1

如果表格和 td 样式定义之间的 3 个点也出现在您的代码中，它们可能是原因。