改行時に太い下線が機能することを確認するにはどうすればよいですか?
P粉366946380
P粉366946380 2023-09-05 13:21:47
0
1
453
<p>次のコードを使用して、より太く、より様式化された下線装飾をハイパーリンクに追加します。 </p> <pre class="brush:php;toolbar:false;">a { テキスト装飾: なし; 位置: 相対;} a:ホバー { カラー: #c0632e; } a::after { 内容: ""; 位置: 絶対; 幅: 100%; 高さ: 30%; 下: 0; 左: 0; 背景色: #2EB0C0; 不透明度: 0.15; Z インデックス: -1; } a:hover::after {background-color: #c0632e; }</pre> <p>ただし、それをクラスに変換し、<code><span></code> として各リンクに追加した場合にのみ機能します。グローバルに実装しようとすると、ハイパーリンクの途中に改行があると機能しません。改行がない場合は正常に動作しますが、改行がある場合は正常に動作しません。 </p> <p>ハイパーリンクごとに <code><span></code> を定義せずにグローバルに使用できるようにこれを修正する方法はありますか? </p>
P粉366946380
P粉366946380

全員に返信(1)
P粉356128676

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

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

リーリー

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート