1

次のプログラムを使用して、マウスオーバーイベントで行を強調表示しますが、特定の行にマウスを合わせると、強調表示バーの間に空白が発生しますか? 空白を削除するには？

テーブルの作成: 

<table border="0" id="TabDeclaration"  width="100%" cellpadding="5" cellspacing="3" border="2">
    <tr>
        <td>aaaa</td>
        <td>bbbb</td>
        <td>azaz</td>
    </tr>
    <tr>
        <td>cccc</td>
        <td>dddd</td>
    </tr>
    <tr>
        <td>eeee</td>
        <td>ffff</td>
    </tr>      
</table>

呼び出しCSSのjQuery：

$('#TabDeclaration tr').mouseover(function() {
    if($.trim($(this).text()) != '')
       $(this).addClass('hovered');
    }).mouseout(function() {
       $(this).removeClass('hovered');
});

CSS:

.hovered td {
   background: #ddd;
}
4

2 に答える 2

4

なぜあなたはjavascriptを使うつもりですか？CSS:hoverセレクターを使用する方がはるかに簡単です。

HTML:

<tr>
    <td>aaaa</td>
    <td>bbbb</td>
    <td>azaz</td>
</tr>

<tr>
    <td>cccc</td>
    <td>dddd</td>
</tr>
 <tr>
    <td>eeee</td>
    <td>ffff</td>
</tr>

CSS:

tr:hover {
  background: #ddd;
}

これは、マウスがテーブルの行の上にあるときに問題なく動作するはずです。セレクターは、タグ:hoverだけでなく、あらゆる HTML 要素で機能します。<a>

于 2012-07-24T14:04:02.377 に答える
0

table タグで、この属性を定義します

cellspacing="0"
于 2012-07-24T13:57:21.467 に答える