0

強調表示されたテーブル セルの隅に (CSS 境界線と :before を使用して) 三角形を追加したいと思います。デフォルトの display:table-cell を使用すると、セルの隅に正しく追加されず、テーブルの隅に追加されます。そこで、その表のセルに display:block を使用します。

コードは次のとおりです。

.cell-highlighted-triangle {
    display: block;
    position: relative;
}

.cell-highlighted-triangle:after {
    content: "";
    position: absolute;
    top: 0; right: 0;
    border-width: 0 20px 20px 0;
    border-bottom-color: transparent;
    border-right-color: #510FAD;
    border-style: solid;
}

表のセルを強調表示するには、次を使用します: td class="cell-highlighted-triangle"

ただし、これは結果であり、強調表示された列セル 2、3、4 がすべて列 2 に固定されていることを示しています。

https://lh5.googleusercontent.com/-wUJrlaeugAI/T7UEbCdbA2I/AAAAAAAAAJM/_iu9ZxHrwGc/s519/pic.png

助けてくれてありがとう！どんな提案でも大歓迎です！

4

2 に答える 2

0

display: inline-block; を試してください。インラインとブロックの混合のように動作する必要があります!

于 2012-05-17T14:04:38.363 に答える
0

スタイルでプロパティを追加する必要があります: content: "";

.cell-highlighted-triangle:after {
    content: "";
    position: absolute;
    top: 0; right: 0;
    border-width: 0 20px 20px 0;
    border-bottom-color: transparent;
    border-right-color: #510FAD;
    border-style: solid;
}
于 2012-05-17T14:07:47.140 に答える