MainWindow.xaml

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfTest"
        xmlns:Properties="clr-namespace:WpfTest.Properties"
    xmlns:wpf="http://schemas.microsoft.com/netfx/2007/xaml/presentation" x:Class="WpfTest.MainWindow"
        mc:Ignorable="d"
        Title="MainWindow" Height="250" Width="200">
    <!--资源通常定义在根节点，或者资源字典中-->
    <Window.Resources>
        <SolidColorBrush x:Key="MyBrush" Color="Gold"/>
        <!--用style可以对一组属性进行定义-->
        <Style TargetType="Border" x:Key="PageBackground">
            <Setter Property="Background" Value="Blue"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="TitleText">
            <Setter Property="Background" Value="Blue"/>
            <Setter Property="DockPanel.Dock" Value="Top"/>
            <Setter Property="FontSize" Value="18"/>
            <Setter Property="Foreground" Value="#4E87D4"/>
            <Setter Property="FontFamily" Value="Trebuchet MS"/>
            <Setter Property="Margin" Value="0,40,10,10"/>
        </Style>
        <Style TargetType="TextBlock" x:Key="Label">
            <Setter Property="DockPanel.Dock" Value="Right"/>
            <Setter Property="FontSize" Value="8"/>
            <Setter Property="Foreground" Value="{StaticResource MyBrush}"/>
            <Setter Property="FontFamily" Value="Arial"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Margin" Value="0,3,0,0"/>
        </Style>
    </Window.Resources>
    <Grid Margin="0,0,0,0">
        <StackPanel>
            <!--首先搜寻资源字典，然后再从当前节点开始向上寻找Resource-->
            <!--静态资源引用不支持前向引用-->
            <!--
            StaticResource  https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/advanced/staticresource-markup-extension
            DynamicResource https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/advanced/dynamicresource-markup-extension
            -->
            <Border Style="{StaticResource PageBackground}" Height="220" Margin="0,0,-0.4,0">
                <DockPanel Margin="0,0,-0.4,0">
                    <TextBlock Style="{StaticResource TitleText}">Title</TextBlock>
                    <TextBlock Style="{StaticResource Label}">Label</TextBlock>
                    <TextBlock DockPanel.Dock="Top" HorizontalAlignment="Left" FontSize="36" Foreground="{StaticResource MyBrush}" Text="Text" Margin="20" />
                    <Button DockPanel.Dock="Top" HorizontalAlignment="Left" Height="30" Background="{StaticResource MyBrush}" Margin="0">Button</Button>
                    <Ellipse DockPanel.Dock="Top" HorizontalAlignment="Left" Width="100" Height="100" Fill="{StaticResource MyBrush}" Margin="40" />
                </DockPanel>
            </Border>
        </StackPanel>
    </Grid>
</Window>

效果截图