在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5  HTML/ CSS選擇中的 " ~ " 條件啟動選擇器 求資料

CSS選擇中的 " ~ " 條件啟動選擇器 求資料

偶爾看到一個語句：

s1:hover ~ s2{color:red;}

發(fā)現(xiàn) " ~ " 可以使得選擇器實現(xiàn)“if”的效果，就是 ~ 前邊的條件滿足了，就會啟動后面s2的選擇器。
但是google半天沒有找到教程資料，w3c/mdn都查了~ 實在不知道 這個知識點叫什么名字，也沒法查
希望大神們給點指引~

__

首先謝謝大家給的指點~
原因找到了，不過是動態(tài)偽類+兄弟選擇器,知識點都學(xué)過，可是一直沒實戰(zhàn)。昨天看一個實例的原碼時突然愣住了，還以為這個~ 是個HTML5的新符號，鉆死胡同半天。

看來光看書、做題，不能融會貫通，腦子里沒有創(chuàng)造力、整合力，遇到實際問題就卡住，真的崩潰。

再次謝謝大家?guī)椭?/p>

回答
編輯回答
雅痞

https://developer.mozilla.org...

2017年5月25日 02:36
編輯回答
單眼皮

你說的倒也沒錯……肯定是前面都滿足了才會啟動后面的，不過 google 半天沒查到資料可見你 google 水平比較差。

  1. 搜索 css selector ~
  2. 抵達(dá) MDN CSS selectors
  3. 頁面內(nèi)搜索 ~
  4. 找到內(nèi)容
2017年3月13日 10:45
編輯回答
使勁操

我覺的你是不是把這個“～”想的太高端了，如果你把:hover想成一個元素，是不是就可以理解了。

2017年3月11日 01:37
編輯回答
抱緊我

這個符號的意思是當(dāng)前元素后面的所有同級元素
.s1:hover ~ .s2這句解釋就是 s1在hover狀態(tài)下，對它后面的平級的s2應(yīng)用樣式

<div class="container">
    <div class="s2">不受影響，雖與S1同級，但是它在S1前面</div>
    <div class="s1"></div>
    <div class="s2">受影響</div>
    <div class="s2">受影響</div>
    <div class="s2">受影響</div>
    <div class="s3">
        <div class="s2">不受影響，因為與s1不同級別</div>
    </div>
</div>
2017年4月2日 20:29