我希望在WPF中创建一个热键页面,我在其中显示应用程序中所有可用热键的图形表示。而不是使用图标,因为我无法找到包含Home键的好集,例如我想使用与StackOverflow类似的样式。
我试图复制并应用以下样式:
F4
CSS是:
kbd {
padding: 0.1em 0.6em;
border: 1px solid #CCC;
font-size: 11px;
font-family: Arial,Helvetica,sans-serif;
background-color: #F7F7F7;
color: #333;
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 2px #FFF inset;
border-radius: 3px;
display: inline-block;
margin: 0px 0.1em;
text-shadow: 0px 1px 0px #FFF;
line-height: 1.4;
white-space: nowrap;
}
我似乎找不到重现盒子阴影(特别是两个),border-radius和text-shadow的方法。
或者,如果有人知道可以使用的键盘键的完整图标设置。
目前有:
<Border BorderThickness="1" CornerRadius="3" Background="#FFF7F7F7"
HorizontalAlignment="Center" VerticalAlignment="Center">
<Border.Effect>
<DropShadowEffect ShadowDepth="1" BlurRadius="3" Color="#33000000" Direction="270"/>
</Border.Effect>
<Border BorderThickness="1" CornerRadius="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Border.Effect>
<DropShadowEffect ShadowDepth="1" BlurRadius="3" Color="#FFFFFFFF"/>
</Border.Effect>
<TextBlock Padding="1.1 6.6" FontSize="11" FontFamily="Arial,Helvetica,sans-serif" Foreground="#FF333333">HOME</TextBlock>
</Border>
</Border>
答案 0 :(得分:1)
试试这个:
<Border HorizontalAlignment="Center" VerticalAlignment="Center"
Background="#FFF7F7F7"
BorderThickness="1" BorderBrush="#FFCCCCCC" CornerRadius="3">
<Border.Effect>
<DropShadowEffect ShadowDepth="1" BlurRadius="0" Direction="270" Opacity="0.2"/>
</Border.Effect>
<Border HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
BorderThickness="2" BorderBrush="White" CornerRadius="3">
<TextBlock Padding="1.1 6.6" FontSize="11" FontFamily="Arial,Helvetica,sans-serif" Foreground="#FF333333">
<TextBlock.Effect>
<DropShadowEffect BlurRadius="0" Color="White" Direction="270" ShadowDepth="1"/>
</TextBlock.Effect>
HOME
</TextBlock>
</Border>
</Border>