HTML CSS仅限边框

Question

我想只有一个带边框的单元格（B2）。我不想在表格中使用表格。

<table border="0">
    <tr>
        <td>A1</td>
        <td>B1</td>
        <td>C1</td>
    </tr>
    <tr>
        <td>A2</td>
        <td>B2</td>  <!-- Only this cell should have a border -->
        <td>C2</td>
    </tr>
    <tr>
        <td>A3</td>
        <td>B3</td>
        <td>C3</td>
    </tr>
</table>

Answer 1

我建议：

tr:nth-child(2) td:nth-child(2) {
    border: 1px solid #000;
}

JS Fiddle demo

或者，支持那些不实现:nth-child()的浏览器：

tr:first-child + tr td:first-child + td {
    border: 1px solid #000;
}

JS Fiddle demo

Answer 2

喜欢这个？

JsFiddle

HTML：

<table border="0">
    <tr>
        <td>A1</td>
        <td>B1</td>
        <td>C1</td>
    </tr>
    <tr>
        <td>A2</td>
        <td class='border-me'>B2</td>  <!-- Only this cell should have a border -->
        <td>C2</td>
    </tr>
    <tr>
        <td>A3</td>
        <td>B3</td>
        <td>C3</td>
    </tr>
</table>

CSS：

.border-me{
    border:2px solid red;
}

Answer 3

您可以将CSS样式内联或应用于该元素，例如......

<table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td>A1</td>
        <td>B1</td>
        <td>C1</td>
    </tr>
    <tr>
        <td>A2</td>
        <td style="border: 1px solid black">B2</td>  <!-- Only this cell should have a border -->
        <td>C2</td>
    </tr>
    <tr>
        <td>A3</td>
        <td>B3</td>
        <td>C3</td>
    </tr>
</table>

Here's a Fiddle

Answer 4

HTML：

<td id="bordered">B2</td>

CSS：

#bordered {
border: 1px solid #000;
}

试试。