CSSで下線と上書きの色を変える方法はありますか？

私はここでは、この現在CSSで下線と上書きの色を変える方法はありますか？

p { 
 
    text-decoration: underline overline red; 
 
}

<p> 
 
This is some text 
 
</p>

を持っているが、私はoverlineとunderlineのためのさまざまな色を持っていると思います。

これはまったく可能ですか？

出典

2017-12-29 Shashwat Khanna

それはhttps://stackoverflow.com/questions/45791793/css-multiple-text-decorations-with-style-and-color – SreeWarr

@SreeWarr大井おかげで、ここで答えています。私は検索を試みたが、その答えを見つけられなかった。あなたが喜んで助けた。 –

spanをpに入れてから、別の色を設定することができます（overline）。

出典

2017-12-29 19:08:58

p { 
 
    text-decoration: blue underline ; 
 
} 
 
span { 
 
    text-decoration: red overline; 
 
}

<p><span>This is some text Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis ut iusto optio, similique iure. Autem facilis, eveniet vel ea mollitia ad obcaecati dignissimos nisi, reiciendis odio voluptas, aliquid iure voluptatibus.</span></p>

は、私の知る限りでは、あなたは一度だけ text-decoration-colorを設定することができ、すべての装飾が同じ色になります。あなたが使っている構文も現在Firefoxでしか動かないでしょう。他のブラウザでは -webkitのようなプレフィックスが必要となり、ブラウザで実験的な機能を有効にする必要があります。

より普遍的な互換性のあるソリューションは、テキストに罫線を適用することです。あなたはあなたが望む効果を達成することができ、どこでも互換性があります。

p { 
 
    border-top: 1px solid blue; 
 
    border-bottom: 1px solid red; 
 
    display: inline-block; 
 
}

<p>Testing</p>

出典

2017-12-29 19:13:39

これは、オーバー/アンダーラインとは非常に異なります。 'inline-block 'なしでは動作しませんし、複数行では動作しません。 – Amit

CSSで下線と上書きの色を変える方法はありますか？

答えて

関連する問題