改行時に太い下線が機能することを確認するにはどうすればよいですか?

Question

次のコードを使用して、より太く、より様式化された下線装飾をハイパーリンクに追加します。

a { テキスト装飾: なし; 位置: 相対;}

a:ホバー { カラー: #c0632e; }

a::after { 内容: ""; 位置: 絶対; 幅: 100%; 高さ: 30%;
        下: 0; 左: 0; 背景色: #2EB0C0;
        不透明度: 0.15; Z インデックス: -1; }
    
a:hover::after {background-color: #c0632e; }

ただし、それをクラスに変換し、 として各リンクに追加した場合にのみ機能します。グローバルに実装しようとすると、ハイパーリンクの途中に改行があると機能しません。改行がない場合は正常に動作しますが、改行がある場合は正常に動作しません。

ハイパーリンクごとに を定義せずにグローバルに使用できるようにこれを修正する方法はありますか?

Answer 1

私も最近同じ問題に遭遇しました。 ::after の代わりに borderbottom を使用することをお勧めします。 これを試して：＃＃＃ リーリー

rem の代わりに px を使用してサイズを指定することもできます。境界線が表示されない場合は、境界線の色を指定することを忘れないでください

リーリー