首页 > 解决方案 > xamarin 中的网格样式

问题描述

我正在使用带有 xamarin 表单的 css 样式。我有网格按钮:在此处输入图像描述

StackLayout {
    background-color: #1e1e1e;
    color: #ffffff;
}

Button{
    background-color: #2d2d30;
    font-family: Consolas;
    font-size: 24;

    margin: 0;
}

和 xaml:

<Grid>
    <Grid.ColumnDefinitions>
    /*...*/
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    /*...*/
    </Grid.RowDefinitions>
    <Button/>
    <Button/>
    /*...*/
</Grid>

如何消除按钮之间的这种间隙?

标签: c#cssxamarinstyles

解决方案


这是内联块元素问题。如你看到的:

button {
  width: 50px;
  height: 50px;
  background: #000;
  outline:none;
  border:none;
  margin:0;
}
<button></button>
<button></button>
<button></button>

我们可以使用这两种方法来消除差距。

  1. 相邻写

button {
  width: 50px;
  height: 50px;
  background: #000;
  outline:none;
  border:none;
}
<button></button><button></button><button></button>

  1. 评论行

button {
  width: 50px;
  height: 50px;
  background: #000;
  outline:none;
  border:none;
}
<button></button><!--
--><button></button><!--
--><button></button>


推荐阅读