[解決済み] CSSで色を反転させるには?
2022-03-15 18:54:02
質問
HTML
<div>
<p>inverted color</p>
</div>
CSS
div {
background-color: #f00;
}
p {
color: /* how to use inverted color here in relation with div background ? */
}
を反転させる方法はありますか?
p
の色をCSSで変更できますか?
があります。
color: transparent;
なぜか
color: invert;
CSS3でも?
解決方法は?
段落に背景と同じ色を追加し、CSSで反転させる。
div {
background-color: #f00;
}
p {
color: #f00;
-webkit-filter: invert(100%);
filter: invert(100%);
}
<div>
<p>inverted color</p>
</div>
関連
-
[CSSチュートリアル]css display table adaptive height, widthの問題解決
-
[css3]css3は、3つの方法のサンプルコードのテキストの点滅効果を達成するために
-
[css3]赤いパケットのジッター効果を実現するCSS3
-
[CSSチュートリアル】シンプルなナビゲーションバー機能を実現するhtml+css
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] CSSのdisplayプロパティで遷移する
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[CSSチュートリアル】height:100%と書いても効かない理由
-
[css3] scss変数の値を実行時に変更するcss3 var()の使用方法を説明します。
-
[css3]グレーモードやブラックモードを実現するCSS3フィルター(フィルター)サンプルコード(Webページ用
-
[CSSチュートリアル】CSSで実現するTikTokのテキストジッター効果例
-
[CSSチュートリアル】カラフルで知的なシャドウ効果を実現するCSS
-
[css3]CSS3アニメーションによる光のボタンの流れの効果
-
[ブラウザ互換性チュートリアル]IE9でのネイティブページの互換性問題の解決方法について
-
[css3]CSS3遷移回転遠近法2D3Dアニメーションなどの効果を持つサンプルコード
-
[css3]本のページをめくるような効果を実現するcss3サンプルコード
-
[解決済み] webkit-transformを使用した場合、ポジション固定が効かない