为何CSS的border-radius在Xamarin XAML中无法生效？

我明白你遇到的困扰了——明明在CSS里写了border-radius，不管是全局button选择器还是.HeaderButtons类，就是达不到XAML里CornerRadius="5"的圆角效果。这其实是Xamarin.Forms CSS属性映射里的几个常见小问题，我给你几个可行的解决方案：

1. 给border-radius加上明确的单位 #

虽然官方文档说明border-radius对应XAML的CornerRadius属性，但在部分Xamarin.Forms版本中，省略单位的写法可能无法被正确解析。建议加上dp（设备独立像素，和XAML的单位逻辑一致）：

button { 
  border-radius: 5dp; /* 加上dp单位 */
}

.HeaderButtons { 
  border-width: 2; 
  font-size: 16; 
  font-style: bold; 
  border-color: black; 
  color: white; 
  border-radius: 5dp; /* 同样给类选择器加上单位 */
}

2. 检查Xamarin.Forms版本与平台渲染限制 #

• 如果你使用的是Xamarin.Forms 4.5以下的版本，CSS对Button圆角的支持存在一些bug，建议升级到5.0及以上的稳定版本。
• 部分平台（比如Android）对Button圆角的渲染有额外要求：必须同时设置BorderWidth和BorderColor（你已经在CSS里设置了，但可以确认没有被其他XAML样式覆盖）。

3. 备选方案：XAML基础样式+CSS类结合 #

如果上述方法都不生效，可以先在XAML里定义一个包含CornerRadius的基础样式，再结合CSS类来设置其他样式：

<ContentPage.Resources>
  <Style x:Key="RoundedButtonBase" TargetType="Button">
    <Setter Property="CornerRadius" Value="5" />
  </Style>
  <x:StyleSheetExtension Source="Default.css" />
</ContentPage.Resources>

然后给每个Button同时引用基础样式和CSS类：

<Button x:Name="btnSale" Style="{StaticResource RoundedButtonBase}" StyleClass="HeaderButtons" ... />

最后别忘了清理缓存 #

有时候项目的bin/obj文件夹缓存会导致样式不更新，试试删除这两个文件夹后重新编译项目，说不定能解决奇怪的样式失效问题。

内容的提问来源于stack exchange，提问作者Randy