body：before CSSでのメディアクエリの意味

セレクタ（pまたはspanなど）の使用方法は知っていますが、bodyタグではどのように機能しますか？body：before CSSでのメディアクエリの意味

これは私のCSSです：

body { 
    background: #3E3E3E; 
    background: url([my-bg-img-url].jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    position: fixed; 
    height: 100%; 
    padding: 0px 0px 0px 0px !important; 
    margin: 0px; 
    font-family: 'Open Sans'; 
    font-weight: 300; 
} 

@media only screen and (max-width: 1024px) { 
    body:before{ 
     content: ""; 
     display: block; 
     position: fixed; 
     left: 0; 
     top: 0; 
     width: 100%; 
     height: 100%; 
     z-index: -10; 
     background: url([my-bg-mobile-img-url].jpg) no-repeat center center; 
     -webkit-background-size: cover; 
     -moz-background-size: cover; 
     -o-background-size: cover; 
     background-size: cover; 
    } 
}

質問：

1）この場合には:beforeしくみを教えてください。

2）私のrecaptcha v2のポップアップウィンドウ（「すべての画像を選択...」）をモバイルでスクロールすることはできません（カットオフ）。最初のposition:fixedを削除しても、2番目のファイルが存在しても、recaptchaが機能します。なぜ最初のposition:fixedはrecaptchaでそのバグを作成するのですか？

3）私は、::beforeがCSS3で、:beforeがCSS2であることを読んでいますが、どちらを互換性のあるWebサイトに使用する必要がありますか？

出典

2017-01-10 Bedo

このライブはどこですか？ –

1）この場合の作業前には？

<body>は一意ですが、単なるHTML要素であり、擬似要素を持つことができます。

2）私のrecaptcha v2のポップアップウィンドウ（「すべての画像を選択...」）をモバイルでスクロールすることはできません（カットオフ）。私が最初の位置を取り除いた場合：固定されていて、2番目の位置が固定されていても、recaptchaが機能します。なぜ最初の位置：固定されたrecaptchaでそのバグを作成するのですか？

私はそれがバグを引き起こしたとは思わない。 position: fixedはビューポートを基準にしており、width: 100%とheight: 100%で、ビューポート全体を完全に覆い、スクロールバーでは移動しません。

3）私は以前にCSS3とそれ以前：CSS2があります。どちらを互換性のあるWebサイトに使うべきですか？

彼らはまったく同じ動作しますが、より多くのブラウザでちょうど1 :作品（IEの例えば古いバージョン）と:before。

出典

2017-01-10 20:47:28 Stickers

body：before CSSでのメディアクエリの意味

答えて

関連する問題