質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

2390閲覧

背景を含んだフィルターを一部分のimgだけ除外したい

fffffffffffff

総合スコア8

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2019/08/03 00:26

編集2019/08/04 00:46

CSS

1#example { 2background-image: url("画像へのパス"); 3filter:grayscale(100%); 4}

というフィルターを、example内の1つのimgタグのみフィルターを解除したいのですが出来るでしょうか?

CSS

1#example :not(img.jogai){ 2background-image: url("画像へのパス"); 3filter:grayscale(100%); 4}

HTML

1<div id="example"> 2<p>あああああああああああ。</p> 3<img src="1.gif"> 4<img src="2.gif"> 5<img src="3.gif" class="jogai"> 6</div>

みたいな感じかなと思ってやってみてるんですけど出来なくて…。
背景や1.gif、2.gifに直接グレースケールフィルタを掛けろと言われるかも知れませんが、数が多くて…。

CSS

1#example img.jogai::after{ 2filter:none 3}

でやってみたのですができませんでした。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2019/08/03 03:43

まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。
fffffffffffff

2019/08/03 06:40

解決自体はしてないです!解決できなかったんですもの・・・・。
guest

回答2

0

1.gif、2.gifに直接グレースケールフィルタを掛けろと言われるかも知れませんが、数が多くて…。

それでもCSS1発でできますが。

CSS

1#example img:not(.jogai) { 2 filter:grayscale(100%); 3}

投稿2019/08/03 00:32

maisumakun

総合スコア145121

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

fffffffffffff

2019/08/03 00:45

引き続きすみません。フィルターを背景にも適用させるにはどうしたらいいでしょうか?
fffffffffffff

2019/08/03 00:45

#example img:not(.jogai) { filter:grayscale(100%); } にすると背景に適用されなくなってしまって困っています。
fffffffffffff

2019/08/03 00:47

#example { background: url(bg.jpg) center top no-repeat; } で指定しています。
fffffffffffff

2019/08/03 00:48

body background img:not(.emo) { filter:grayscale(100%); } ではないのですね・・・。
maisumakun

2019/08/03 00:51

「1.gif、2.gifに直接グレースケールフィルタを掛けろと言われるかも知れませんが」のくだりから、「中にある画像だけかかればいいもの」と判断していました。 「背景を含めてフィルターをかけつつも、特定の画像だけ外す」ことはできません。背景をbackgroundではなく、疑似要素で生成すればどうにかなるかもしれません。
fffffffffffff

2019/08/03 00:54

すみません、書かなくても出来るかと勝手に判断して書いていませんでした。出来ないのですね。ありがとうございました!
guest

0

自己解決

divの上に別のdivを作って
下のdivだけフィルターをかければ良いんじゃないですかね!?

投稿2019/08/06 10:40

fffffffffffff

総合スコア8

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問