Like in CSS you can now cascade styles in Silverlight 3 too. You can append and/or override values by basing one style on another. In this way you can built a powerful and reusable set of styles to apply in your Silverlight applications.
Syntax
Style cascading is accomplished by using the new BasedOn attribute of the Style class.
1: <Style x:Name="Headline" TargetType="TextBlock">
2: <Setter Property="FontFamily" Value="Verdana" />
3: <Setter Property="FontSize" Value="14" />
4: </Style>
5: <Style x:Name="ImportantHeadline" TargetType="TextBlock"
6: BasedOn="{StaticResource Headline}">
7: <Setter Property="Foreground" Value="Red" />
8: </Style>
9: <Style x:Name="HomePageHeadline" TargetType="TextBlock"
10: BasedOn="{StaticResource Headline}">
11: <Setter Property="FontSize" Value="18" />
12: </Style>
Here we have a base style Headline that targets TextBlock elements and defines values for FontFamily and FontSize. Next we have another style ImportantHeadline which again targets TextBlock elements. Note here the additional attribute BasedOn(Line 6). By using it we are basing this style on the style defined by its value – Headline in this example. Here we set the Foreground property of the TextBlock to be Red.
When we use the ImportantHeadline style on a TextBlock we are going to have both of the values set in the Headline style(FontFamily, FontSize) and those set in ImportantHeadline(Foreground).
Then another style HomePageHeadline is defined. It is also based on the Headline style, but this time it overrides the base value set for FontSize. Now when we use the HomePageHeadline on a TextBlock we can see that it appears with FontFamily Verdana and FontSize 18.
The results are as follows:
Download Source Code
Note: you can cascade styles on more than one level. Following the example above you can base another style on the HomePageHeadline and you will have 3 levels of cascading.
Hope that helps!
That's it!