負の z-index 属性 value_html/css_WEB-ITnose の影響

WBOY
リリース: 2016-06-24 11:41:10
オリジナル
2951 人が閲覧しました

負の z-index 属性値の影響:

多くの CSS コードでは、z-index 属性値が負の数値に設定されている状況を簡単に紹介します。この属性の値は負のパフォーマンスです。通常の状況では、オブジェクトに位置属性が設定されており、その属性値が静的でない限り、このオブジェクトは位置指定されていないオブジェクトをカバーできます。 コード例は次のとおりです。

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">div{ width:100px; height:100px;}.a{ position:relative; right:20px; top:20px; background-color:red; z-index:1;}.b{ background-color:green;}</style></head><body> <div class="a"></div> <div class="b"></div></body></html>
ログイン後にコピー

上記のコードでは、 a 要素は b 要素をカバーできる 例:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">div{ width:100px; height:100px;}.a{ position:relative; right:20px; top:20px; background-color:red; z-index:-1;}.b{ background-color:green;}</style></head><body> <div class="a"></div> <div class="b"></div></body></html>
ログイン後にコピー

上記のコードから、b 要素が a 要素をカバーできることがわかります。ドキュメント フローは位置属性をカバーできますが、その属性値は静的ではなく、z-index 値は負のオブジェクトです。

元のアドレスは次のとおりです: http://www.51texiao.cn/div_cssjiaocheng/2015/0503/583.html

最も元のアドレスは次のとおりです: http://www.softwhy.com/

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート