带边框的文本输入下划线：无

Question

我试图在没有边框的输入框（如图1所示）下划线。

我想要什么：

我所拥有的：

可以请教吗？谢谢。

Answer 1

尝试使用：

public class Main : ContentPage
{
    public BoxView pjOne = new BoxView { BackgroundColor = Color.Red, HeightRequest = 100, WidthRequest = 100, HorizontalOptions = LayoutOptions.Center, VerticalOptions = LayoutOptions.StartAndExpand };
    public BoxView pjTwo = new BoxView { BackgroundColor = Color.Green, HeightRequest = 100, WidthRequest = 100, HorizontalOptions = LayoutOptions.Center, VerticalOptions = LayoutOptions.CenterAndExpand };
    public Button btnDown = new Button { HorizontalOptions = LayoutOptions.FillAndExpand, VerticalOptions = LayoutOptions.End, Text = "Down", TextColor = Color.White };

    public Main()
    {
        btnDown.Clicked += (s, e) =>
        {
            if(!pjOne.Bounds.IntersectsWith(pjTwo.Bounds))
            {
                pjOne.TranslationY -= 100; //If it does not detect collision it decreases the TranslationY
            }
            else
            {
                pjOne.TranslationY += 100; //If it detects collision it increases the TranslationY
            }
        };

        Content = new StackLayout
        {
            Children =
            {
                pjOne,
                pjTwo,
                btnDown
            }
        };
    }
}

我认为这就是您想要的？

Answer 2

border: none将所有边框的边框样式均设置为无；您需要通过将特定样式solid设置到底部边框来覆盖它：

body {background-color: #CCC}

input {
  border: none;
  background: none;
  border-bottom: 2px;
  border-bottom-style: solid;
  border-bottom-color: white;
  /* Or combine the above:   border-bottom: 2px solid white */
}

<input>