透過を実現する為にnetを見ながらcssを作成しました。
visualstudioで確認すると、波線でエラーが出てしまいます。
エラー文言は下記。
どうする事が一番ベターかご存知の方いらしたら伺えれば幸いで御座います。
気になる質問をクリップする
クリップした質問は、後からいつでもMYページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
回答3件
0
ベストアンサー
-moz-opacity
の行は削除して下さい。
-moz-
の接頭辞は「Mozilla Firefox」に適用されますが、Firefoxは、バージョン0.9で接頭辞なしのopacity
に対応しています。もはや、全く不要です(MDN)。
投稿2017/03/13 07:06
総合スコア145121
0
CSS3.0 の文法チェックの警告なので、単純に出ないようにするというのであれば、
CSS3.0の文法上正しい opacity:
のみの記載でOKです。
ではなぜ、WEBで見つけたソースに他の2つが必要だと書いてあったかですが
・filter:alpha(opacity)
は、InternetExplorer8
以下に適用させるため
・-moz-opacity:
は、Firefox3.4
以下に適用させるため
です。
コレを記載するかどうかは、古いブラウザをどこまで対応させるかというウェブサイトの設計ポリシーに依存します。
###ブラウザシェアで考える
ちなみに2017年時点のブラウザシェアは、IE8以下
は約1.2%
。Firefox3.4
以下は 0.2%
となっており、合わせても1.4%
程です。(セルフ調べ)
※実情は、このような古いブラウザバージョンのシェア数は、大部分が自治体や大学などソフトウェアの更新に許可・手続きが必要な団体が保有するPCがこの数%を保持する要因になっており(日本独特の理由)、一般的なユーザを考えた時に、実は無視して良いレベルの%だったりします。
それでも、ウェブサイトが公共性のあるターゲット層を持つならば、実情まだこの2つは維持しても問題ないかと思います。
Visualstudioのエラーだけを嫌うならば0.2%(1000人に2人)を切り捨て、-moz-opacity:
だけを削除するのも良いでしょう。
###もう一つの方法も
ちなみに透過処理にはもう1つ方法があり
background-color:rgba(255,255,255,0.85);
のように、RGBA()
を使う事で箇所を指定して透過することができます。16進数のRGB数値と透過値(Alpha)で指定します。
opacity
は、要素の中身全てを透過するために「その中にある文字も透過されて見づらい!」なんて事もよくありますが、RGBA()
を使う場合、背景色だけ、枠線色だけというような指定が出来るので、使い勝手が良かったりします。
投稿2017/03/13 09:02
編集2017/03/13 09:06総合スコア506
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
0
頭についている-mozとは、ベンダープレフィックスと呼ばれるものです。これは「本来CSSの標準には存在しないけど、うちのブラウザでは対応する」というものです。opacity、つまり不透明度ですが、mozはFireFox(Mozilla)系を表しており、昔は-moz-opacityという名前で指定することで、opacityが標準にない頃からFireFox上で透明度を扱うことができるというものでした。VisualStudioはMicrosoft系列、つまりIEやEdgeなので、-mozというベンダープレフィックスはデフォルトでは受け付けていないのでしょう。
それで、警告の消し方ですが、私の手元にはすぐ試せるVisualStudioがないので検索して出てきた結果を参考に貼り付けておきます。
http://ja.stackoverflow.com/questions/2675/web-essentials-%E3%81%AEcss%E3%83%81%E3%82%A7%E3%83%83%E3%82%AF%E5%86%85%E5%AE%B9%E3%82%92%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95
投稿2017/03/13 07:13
総合スコア9206
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/03/13 07:57
2017/03/13 08:17
あなたの回答
tips
太字
斜体
打ち消し線
見出し
引用テキストの挿入
コードの挿入
リンクの挿入
リストの挿入
番号リストの挿入
表の挿入
水平線の挿入
プレビュー
質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/03/13 08:17