<Style Selector="Button">
<Style Selector="local|Button">
new Style(x => x.OfType<Button>());
new Style(x => x.OfType(typeof(Button)));
按类型选择控件。上面的第一个示例选择Avalonia.Controls.Button类。若要在类型中引用XAML命名空间,请使用|字符分隔命名空间和类型。
此选择器不会匹配派生类。想要实现派生类匹配请使用Is选择器。
<Style Selector="#myButton">
<Style Selector="Button#myButton">
new Style(x => x.Name("myButton"));
new Style(x => x.OfType<Button>().Name("myButton"));
使用#字符按控件的Name属性选择一个控件。
<Style Selector="Button.large">
<Style Selector="Button.large:focus">
new Style(x => x.OfType<Button>().Class("large"));
new Style(x => x.OfType<Button>().Class("large").Class(":focus"));
选择一个具有指定样式类的控件。多个类用.字符分开,如果是伪类则用:字符。如果指定了多个样式类,那么控件必须有所有必要的样式类才能够匹配。
这与OfType选择器非常相似,只是它也匹配派生类型。
Child选择器是通过用>字符分隔两个选择器来定义的。此选择器匹配逻辑树中的直接子元素,因此在上面的例子中,选择器将匹配作为StackPanel的直接逻辑子元素的任何Button。
当两个选择器用空格分隔时,选择器将匹配逻辑树中的后代(Descendant),因此在这种情况下,选择器将与作为StackPanel逻辑后代的任何Button匹配。
匹配将某个具体属性设置为某个具体值的所有控件。
匹配控件模板中的控件。这里列出的所有其他选择器都作用在逻辑树上。如果要在控件模板中选择控件,则必须使用此选择器。该示例选择Button模板中的ContentPresenter控件。
取反内部选择器。
查找任意一个与这些选择器中匹配的元素。每个选择器用,分开。
根据元素在一组邻近元素中的位置来匹配。
根据元素在一组邻近元素中的位置来匹配,从末端开始计算。
Nth Child and Nth Last Child Syntax
:nth-child()和:nth-last-child()需要一个参数用以描述一个模式,这个模式用于匹配邻近列表中的元素索引。元素索引数是从1开始的。下面的例子使用:nth-child(),但这条规则也适用于:nth-last-child()。
odd代表在一系列邻近元素中索引为奇数的元素:1、3、5...。
even代表在一系列邻近元素中索引为偶数的元素:2、4、6...。
An+B代表一个列表中的元素,其索引数与An+B定义的自定义数字模式中找到的索引一致,其中:
这可以这样理解: 从B开始的每第A个元素。
奇数元素:1(2×0+1)、3(2×1+1)、5(2×2+1)... 等效 :nth-child(odd)
偶数元素:2(2×1)、4(2×2)、6(2×3)... 等效 :nth-child(even)。请注意,0_(2×0)_是一个有效的符号,然而它不匹配任何元素,因为索引从1开始。
所有从第7个开始的元素: 7(0+7)、8(1+7)、9(2+7)...
从第4开始的每第3个元素:4(3×0+4)、7(3×1+4)、10(3×2+4)、13(3×3+4)...
前3个元素: 3(-1×0+3)、2(-1×1+3)、1(-1×2+3)。所有后续的索引数都小于1,所以没有元素能够匹配。
线上 nth-child 和 nth-last-child 测试工具
通过下面的网站可以很容易地测试nth-child和nth-last-child。 nth-child-tester