![]() |
![]() |
![]() |
![]() |
Selectors work very similar to the way they do on the web.
All widgets have one or more CSS nodes with element names and style classes. When style classes are used in selectors, they have to be prefixed with a period. Widget names can be used in selectors like IDs. When used in a selector, widget names must be prefixed with a # character.
Pattern | Reference | Notes |
---|---|---|
* |
|
|
E |
|
|
E.class |
|
|
E#id |
|
|
E:nth-child(n) |
|
|
E:nth-last-child(n) |
|
|
E:first-child |
|
|
E:last-child |
|
|
E:only-child |
|
|
E:link, E:visited |
|
Corresponds to GTK_STATE_FLAG_LINK and GTK_STATE_FLAGS_VISITED |
E:active, E:hover, E:focus |
|
Correspond to GTK_STATE_FLAG_ACTIVE, GTK_STATE_FLAG_PRELIGHT, GTK_STATE_FLAGS_FOCUSED |
E:focus-within |
|
Set on all ancestors of the focus widget, unlike CSS |
E:focus-visible |
|
Set on focus widget and all ancestors, unlike CSS |
E:disabled |
|
Corresponds to GTK_STATE_FLAG_INSENSITIVE |
E:disabled |
|
Corresponds to GTK_STATE_FLAG_CHECKED |
E:indeterminate |
|
Corresponds to GTK_STATE_FLAG_INCONSISTENT |
E:backdrop, E:selected | Corresponds to GTK_STATE_FLAG_BACKDROP, GTK_STATE_FLAG_SELECTED | |
E:not(selector) |
|
|
E:dir(ltr), E:dir(rtl) |
|
|
E:drop(active) |
|
|
E F |
|
|
E > F |
|
|
E ~ F |
|
|
E + F |
|