レスポンシブで、クラス属性の親要素を指定せず、子要素だけで表示させる方法が分からない。

Question

前提

自分でWebサイトを作っているところ、レスポンシブで躓いてしまいました。

プロゲートというサイトを使っていたのですが、そこでは手前に親要素をしていせず、そのまんま子要素だけを指定していたので、自分もそうできないのかと思いやってみたところ、親要素を前に書かないと表示できないみたいだったので質問させてもらいました。

語彙力なくてすみません

実現したいこと

<div class="pearet_class">
 <div class="chaild_class"></div>
</div>

@media all and (max-width:〇〇px) {
 .pearent_class .chaild_class {
  ~~
 }
}

と、手前に親要素を指定せずに

@media all and (max-width:〇〇px) {
 .chaild_class {
  ~~
 }
}

と子要素だけ指定して表示させたい

該当のソースコード

htmlの部分で、cssを読み込むとこは以下の通りに書いています。

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
<link rel="stylesheet" href="public/css/style.css">
<link rel="stylesheet" href="public/css/ipad.css">
<link rel="stylesheet" href="public/css/mobile.css">

補足情報（FW/ツールのバージョンなど）

OS：MacOS Catalina 10.15.7
Vscode：1.67.2

Comments

[matsuochinyu]

一個目の質問を変更して二個目の質問内容に変えた