2

<tr class="sub-title">正しい位置に矢印画像を追加したいと思います。

tdに別のものを追加せずにこれを行う正しい方法は何<tr class="sub-title">ですか？

.sub-title td背景画像とテキストが中央に配置されます。

.sub-title .arrow-toggle矢印画像が含まれています。

<table style="margin-top:-185px;" border="1">
  <tbody>
    <tr> <td> Item 1 </td> </tr>
    <tr class="sub-title">
        <td colspan="5">Sub-Title Here<span class="arrow-toggle"></span></td>
    </tr>
    <tr> <td> Item 2 </td> </tr>
    <tr> <td> Item 2 </td> </tr>
</tbody>
</table>

CSS

.sub-title .arrow-toggle {
        background: url(/public/images/toggle-arrow.png) no-repeat;
        width: 20px;
        height:20px;
        float:right;
    }



    .sub-title td {
        background: url(/public/images/subtitle.gif) repeat-x;
        color:white;
        padding: 5px;
        font-weight: bold;
        border-top:none;
        border-bottom:1px solid #4799bd;
    }
4

1 に答える 1

1

あなたは実際にほとんどそこにいます。スパンがインライン要素であることを忘れただけです。フロット、幅、高さを適用することはできません。display: block.arrow -toggleクラスに追加するだけで、うまくいくはずです。

于 2012-08-08T22:33:30.810 に答える