Contents

[CSS] 不常用的CSS Selectors筆記

前幾天有用到CSS ~,一直以為跟jQuery的$().siblings()是一樣的東西。
結果不是
在此記錄一下

CSS

element1+element2

抓取element1下一個element2元素

element1~element2

抓取element1之後element2元素

[attribute]
[attribute~=value]
[attribute|=value]

https://www.w3schools.com/cssref/sel_attribute_value_lang.asp
不知道怎麼解譯= =a

[attribute^=value]
[attribute$=value]
[attribute*=value]
:empty
抓取標籤無任何東西

::first-letter
::first-line
:first-of-type
:in-range
input 在range內

:invalid
抓取input驗證type屬性不對

:lang(language)
:nth-child(n)
:nth-last-child(n)
:nth-last-of-type(n)
:nth-of-type(n)
:target

網址#abc,會對印抓取id=abc
jQuery也有此function

—–下面沒有支援jQuery Selector
:optional
非必填的input

:out-of-range

input超出 range

:read-only
:read-write

::selection

選取文字的顏色

jQuery (CSS Selector沒有)

整理完才發現這麼多 囧

:visible Selector
:text Selector
:target Selector
:selected Selector
:submit Selector
:parent Selector
:password Selector
:lt() Selector
:last Selector
:input Selector
:image Selector
:hidden Selector
:header Selector

h1,h2,h3,h4,h5

:has() Selector
:first Selector
:even Selector
:contains() Selector
:animated Selector