ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS+(プラス記号)セレクターの使い方

CSS+(プラス記号)セレクターの使い方

青灯夜游
青灯夜游オリジナル
2019-02-12 17:09:595582ブラウズ

CSS では、" " シンボル セレクターは、指定された要素の直後にあるが、特定の要素内にない要素を選択するために使用されます。以下の記事で詳しく紹介していますので、皆さんの参考になれば幸いです。

CSS+(プラス記号)セレクターの使い方

" " シンボル セレクター

CSS では、" " シンボル セレクターは相対セレクターと呼ばれます。隣接セレクターは、同じ親要素の下にある指定された要素の直後にある別の要素を選択するために使用されます。 [ビデオ チュートリアルの推奨: CSS チュートリアル ]

基本的な文構造:

元素E + 元素F{
 //CSS属性
}

手順: すべての主要なブラウザがサポートしています。 " シンボル セレクター; ただし、IE8 で実行する場合は、 を宣言する必要があります。

#簡単なコード例

次に、その使用方法を示す簡単なコード例を示します。

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8">
        <title>“+”符号选择器</title> 
        <style> 
        body { 
                text-align:center; 
            } 
            h1 { 
            color:red; 
            } 
            div{
            font-size:25px; 
            }
            h2+div { 
                font-size:20px; 
                font-weight:bold; 
                display:inline; 
                background-color: yellow; 
                color:green; 
            } 
        </style> 
    </head> 
    <body> 
        <h1>PHP</h1> 
            <div>HTML</div> 
            <h2>CSS</h2> 
            <div>Javascript</div> 
            <div>MySQL</div> 
    </body> 
</html>

レンダリング:


CSS+(プラス記号)セレクターの使い方

h2 div{} が h2 要素の直後に選択された最初の div 要素であることがわかります。それに合わせたスタイル。

以上がこの記事の全内容です、皆様の学習のお役に立てれば幸いです。さらにエキサイティングなコンテンツについては、PHP 中国語 Web サイトの関連チュートリアルのコラムに注目してください。 ! !

以上がCSS+(プラス記号)セレクターの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。