デフォルトのの下線（テキストではなく、下線）の不透明度/可視性を減らすためにHTMLクラスのCSS属性を使用するのは、<a>タグですか？HTMLのアンダーラインアンダーラインの不透明度を減らす
<h1 class="project-name"><a href="https://itspugle.ga">{{ site.title | default: site.github.repository_name }}</a></h1>`
と
---
---
@import 'jekyll-theme-cayman';
.project-name a {
color: white;
}
解決方法1：現時点で
私の現在の関連ジキルdefault.htmlとstyle.scssはこのようになります
あなたは、CSS テキストベースを使用することができます装飾色プロパティ。
例：
.project-name a {
text-decoration: underline;
-webkit-text-decoration-color: rgba(255, 0, 0, 0.4); /* Safari */
text-decoration-color: rgba(255, 0, 0, 0.4);
}
解決方法2：
あなたはより多くの制御をしたい場合は、単にデフォルトの下線を排除し、色や不透明度を制御するための境界線を使用しています。これの上にはリンクテキストと下線に異なる色を適用することができます。
例：白色、白色、50％の不透明度下線で使用するため
.project-name a {
text-decoration: none;
border-bottom: 1px solid rgba(255, 0, 0, 0.4);
display: inline-block;
}
回答が更新されました。 – Vincent1989
text-decoration属性を使用すると、下線が永久に追加されますが、rgbaの変更は機能します！ありがとう:) – Tim
あなたは歓迎です – Vincent1989
：here
詳しい情報からW3Schoolsのから
p {
background-color: #666;
padding: 100px;
}
a {
color: #fff;
text-decoration: underline;
text-decoration-color: rgba(255, 255, 255, 0);
}
a:hover {
text-decoration-color: rgba(255, 255, 255, 0.5);
}<p>
<a href="#">example</a>
</p>コードサンプルW3C here
私はちょうどそれを試しました、そして今あなたがハイパーリンクされたテキストの上に浮遊していないときでさえ、下線は常に表示します。 '.project-name a：hover { テキスト装飾：下線; text-decoration-color：rgba（255、255、255、0.5）; } 'は動作しません – Tim
が更新されました - この投稿をもう一度確認してください –
' text-decoration：none'を 'に追加してみてください。プロジェクト名a：link' – mdawsondev
text-decorationを使用し、rgbaを使用して既存の色に不透明度を追加することができます。この中で、私はちょうど青の不透明度を落としました。
a {
text-decoration-color: rgba(0, 0, 255, 0.2);
}<a href="#">Hello, World!</a>
代わりの下線に依存する、私は1未満 – Terry
@Terryのアルファと不透明またはRGBA値が低下している底部境界と擬似要素を使用CSSやSASSには自信がないので、擬似要素の意味を理解できません。私が使用できるSASSの例を教えてください。 – Tim