コピー2020.01.17スポンサーリンクCSSの間接セレクタ・隣接セレクタ・直下セレクタ、って知ってますか?知ってる方はここ見なくて大丈夫です。ちなみに私は見たことはあるけど知らないレベルです。間接セレクタ・隣接セレクタ・直下セレクタとはなにか、使い方などをサンプル付きでまとめておきます。間接セレクタある要素以降の要素を指定するためのセレクタです。それで何が便利かというと、見出しが繰り返し出てくる場合、最初の見出しに上マージンは要らないけど二つ目以降の見出しには広めのマージンが欲しい!!ってときです。これね、けっこうありますからね!これはh3見出しのいっこめはマージンなし、2個目以降は上マージンを50pxとってます。間接セレクタは要素が飛んでも効くので、間にh4見出しはさんでますがその下のh3見出しはちゃんとマージンが取られてます。}これは定義つきリストのdtいっこめはマージンなし、2個目以降のdtは上マージンを50pxとってます。}隣接セレクタある要素のとなりの要素を指定するためのセレクタです。h4見出しの隣のpにだけ赤い色をつけています。}直下セレクタある要素の直下の要素を指定するためのセレクタです。「one」のなかに「two」が入れ子になっています。「one」直下のh3だけ赤くなっています。「two」のなかにもh3がありますが、直下ではないので赤くならないんですね。}半角スペースで繋げると、「two」内のh3も赤くなります。}初心者CSS、間接セレクタ・隣接セレクタ・直下セレクタまとめセレクタを使えるようになると、いちいちこまかくクラス指定しなくてよくなるのでソースがすっきりしますよー。Hunt」WEBサイトの配色に困った時のお助けツールを紹介します。Gradient」をわかりやすくご紹介します。使い方とサンプルも!WEB【初心者HTML】よく使うHTML特殊文字のコード初心者向けによく使うHTML特殊文字のコードを置いておきます。ダブルクォーテーション」「大なり・小なりかっこ」をHTMLで表示させたい人向け。WEBなるべくお金をかけずにWEBサイトを作ろうなるべくお金をかけずにWEBサイトを作りたい、という方のためにAdobe製品の代替品として無料で使えるソフトの紹介などを。Generator」をわかりやすくご紹介します。使い方とサンプルも!WEBおしゃれ!かわいい!便利!!商用にも使える無料素材サイトおしゃれでかわいいくて便利な、商用にも使える無料素材サイトを3つご紹介します。すべてベクターデータでダウンロードできる素材サイトです。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。素材アーカイブ2020年2月2020年1月2019年12月2019年11月2019年10月2019年9月2019年8月おすすめサーバこのサイトでも使用しています。間接セレクタh3見出しh3見出しh3見出しh4見出しh3見出しh4見出し隣接セレクタh3見出しh3見出しh3見出しh4見出しh3見出しh4見出し直下セレクタh3見出しh3見出しh3見出しh3見出しh3見出しh3見出し初心者CSS、間接セレクタ・隣接セレクタ・直下セレクタまとめAUTHOR書いた人nullll未経験から突然小さな会社のインハウスWebデザイナーになりましたので、WEBサイト制作に役立つ情報のメモを残そうと思います。同じような方の参考になれば幸いです。nullll14人気記事Cocoonをコーポレートサイトっぽくカスタマイズ!1トップページ編2019.10.152020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!6おまけ:新着情報編2019.11.262020.01.14Cocoonをコーポレートサイトっぽくカスタマイズ!7おまけ:ヘッダに電話番号編2019.12.122020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!2メニュー編2019.10.162020.01.09Cocoonをコーポレートサイトっぽくカスタマイズ!3料金表編2019.10.182020.01.09nullll未経験から突然小さな会社のインハウスWebデザイナーになりましたので、WEBサイト制作に役立つ情報のメモを残そうと思います。同じような方の参考になれば幸いです。Reserved.検索メニューWEBWORDPRESSWORKSいろいろプロフィールタイトルとURLをコピーしました。