スクリーンショットに示すようなテーブルを作成する必要があります:
得られた結果:
問題: 「登録済み」列のスクリーンショットのような緑色の枠線を作成できません。
Q: テーブルの場合、この境界線はどのように作成すればよいですか?
div に書き換えてみましたが、何も機能しませんでした
＃＃＃私のスタイル＃＃＃ リーリー私のコード
ああああ
P粉2141766392024-01-17 15:32:33
スタイル設定のためにテーブル構造を削除する方が簡単であるという @finitelooper の指摘は理解できますが、それを削除するセマンティクスには満足していません。
結局のところ、データは表形式です。
このスニペットは別のアプローチを提供します。つまり、関連する td セルと th セルの疑似要素の前に緑色の境界線を配置します。
これらの曲線は、最初と最後の TD に関連する上下の境界線を設定することによって実現されます。
実際のサイズがどれだけ増加するか (10px) に関しては、コードをいくらか調整する必要がありますが、これは単なるデモンストレーションです:
P粉7388210352024-01-17 10:33:35
ここでテーブルを使用するのはおそらく間違ったアプローチであり、状況が少し複雑になります。テーブル データはありますが、実際にはテーブルではないもの (この境界線など) も表示する必要があります。テーブルを使えばできますが、角を丸くするなどは難しいでしょう。
提案が 2 つあります。 1 つは、コードを同じに保ちながら、透明で枠線のある大きな div を作成し、テーブルの上に移動できるようにすることです。そうすれば、クリックできますが、見た目はきれいになります。## を使用することもできます。 #position:absolute を使用して、希望する場所に配置します。