CSS の前景色と透明度について_html/css_WEB-ITnose

前の言葉

カラーの出現により、Web ページはもはや白黒だけではなくなりました。カラー デザインを上手に使用することで、Web ページに多くの色を加えることができます。 Web ページが人々に与える第一印象は、実際にはその全体的な色です。色の設定方法についてはCSSの6つのカラーモードを参照してください。実際、色の適用は主に、前景色、背景色、透明度の 3 つの部分に分かれています。この記事では主に前景色と透明度について紹介します。

color 前景色

値: inherit

初期値: ユーザーエージェント固有の値

適用対象: すべての要素

継承: あり

【影響境界線】

一般的に言うと、前景は要素のテキストですが、前景には要素の周囲の境界線も含まれます。要素の前景色に直接影響を与える方法は 2 つあり、 color 属性を使用する方法と、 border-color 属性を使用して境界線の色を設定する方法があります。そして、ドキュメントにすべての通常の要素を追加できます。テキストは、body{color:red;} を宣言することによって、赤などの特定の色に設定されます。これにより、他のスタイルを持たないすべてのテキストが赤になります (独自のカラー スタイルを持つアンカーを除く)。ただし、ブラウザにはフォーム要素の色があらかじめ定義されているため、本体の色をフォーム要素に継承することはできません

不透明度は透明です (IE8 ブラウザはサポートしていません)

不透明度は透明度を設定するために使用される CSS3 の特別な機能です。属性の不透明度は要素全体の透明度のみを設定でき、その透明度はその子孫の要素に直接継承されます。このうち、1は完全に不透明、0は完全に透明を意味します

初期値: 1

適用対象: すべての要素

継承: なし

【互換性】

IE8-ブラウザは不透明透明属性をサポートしていません。専用のフィルターを使用して、不透明度透明度属性の透明度効果を実現します

filter:alpha (opacity=transparency value)、透明度値は 0-100 の間の任意の整数です

opacity: 0.8;filter:alpha(opacity=80);