0

我修改了由 _SiteLayout.cshtml 引用的 Site.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 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 现在导致单击处理程序失聪或脱钩或以其他方式出现故障......

4

5 回答 5

3

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

于 2013-04-23T17:56:07.097 回答
1

尝试border:1px solid #600;而不是你目前拥有的。

于 2013-04-23T17:53:42.033 回答
1

这是一个JSFiddle

HTML：

<table>
<tr><td>Test</td></tr>
<tr><td>Test</td></tr>
<tr><td>Test</td><td>Test 2</td></tr>
</table>

CSS：

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;
    border: 1px solid #600;
}

td {
    padding: 0.25em 2em 0.25em 0em;
    border: 1px solid #600;
    margin: 0;
    padding: 4px;
    background-color: #FFC;
}
于 2013-04-23T17:56:13.590 回答
1

“ReferenceError: $ 未定义 [Break On This Error] ...

这表明您的脚本不知道是什么$。有2个可能的问题：

  1. 你没有导入 jQuery（不太可能）
  2. 您在实际脚本之后导入了jQuery.js 。

检查文件的导入顺序：首先是 jQuery，然后是脚本。

于 2013-04-23T19:16:08.950 回答
1

尝试这样写：

边框：1px 实心#600；

于 2013-04-23T17:52:40.050 回答