Question

我有一个很小的问题，在我的表中，我已经获得整个TD可点击，甚至设法得到td：悬停工作。

但是我遇到了一个问题，我需要有一些块说“不完整”（因为我不知道如何在不搞乱块大小的情况下隐藏单元格）。如何在整个单元格突出显示的位置修复它，但不突出显示不完整的单元格？

td a:hover {
  background: #c2ceb5;
  display: block;
  width: 100%;
  height: 100%;
}
td a {
  display: block;
  width: 100%;
  height: 100%;
}
td {
  position: relative;
}
td a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

<table align="" style="border: 0px solid #ffffff; background-color: #5e913f;" class="mceEditable" border="1" cellpadding="5" cellspacing="0" height="207.75" width="1060">
    <tbody>
        <tr>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
                <a class="" title="Super" href="http://handlingmod.jimdo.com/vehicle-list/super/adder/"><span style="color: #ffffff;">Adder</span></a>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
                <a class="" title="Super" href="http://handlingmod.jimdo.com/vehicle-list/super/vacca/"><span style="color: #ffffff;">Vacca</span></a>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
                <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
                <span style="color: #dddddd;">Uncomplete</span>
            </td>
        </tr>

        <tr>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
              <span style="color: #dddddd;">Uncomplete</span>
            </td>
        </tr>

        <tr>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 250px;">
             <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 0px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
            <td style="text-align: center; border: 5px solid #ffffff; width: 0px;">
               <span style="color: #dddddd;">Uncomplete</span>
            </td>
        </tr>
    </tbody>
</table>

<p>
    <span style="color: #ffffff;">&#160;</span>
</p>

Answer 1

看看是否有效 - http://jsfiddle.net/2pfL7toz/

OkHttpClient okHttpClient = new OkHttpClient();

Request request = new Request.Builder().url("http://publicobject.com/helloworld.txt").build();

Callback callback = new Callback() {
    @Override
    public void onFailure(Request request, IOException e) {

    }

    @Override
    public void onResponse(Response response) throws IOException {
        responseString = response.body().string();
    }
};

okHttpClient.newCall(request).enqueue(callback);

Answer 2

this怎么样？

CSS：

td a:hover {
    background: #c2ceb5;
    display: block;
}
td a, td span {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display: block;
    padding-top:20px;
}
td {
    position: relative;
}

注意：如果您的文字包含在单元格内，此解决方案会略有降低。

如何在悬停时突出显示整个表格？

2 个答案: