Question

我在下面有这个代码，我想添加一个边框，使用bootstrap类“.border”制作一个盒子，但我无法弄清楚为什么不工作！可以使用bootstrap v4吗？

public class Urls
{
    public string last { get; set; }
    public string next { get; set; }

}

public class Community
{
    public string have { get; set; }
    public string want { get; set; }
}

public class Data
{
    public string[] style { get; set; }
    public string thumb { get; set; }
    public string[] format { get; set; }
    public string country { get; set; }
    public string[] barcode { get; set; }
    public string uri { get; set; }
    public string[] label { get; set; }
    public string catno { get; set; }
    public string year { get; set; }
    public string[] genre { get; set; }
    public string title { get; set; }
    public string resource_url { get; set; }
    public string type { get; set; }
    public string id { get; set; }

    public Community community { get; set; }
}

public class Results
{
    public Data Results { get; set; }
}       

public class Pagination
{
    public int per_page { get; set; }
    public int items { get; set; }
    public int page { get; set; }
    public int pages { get; set; }

    public Urls urls {get;set;}
    public Results result {get;set;}
}

public class Discogs
{
    public Pagination pagination {get;set}
}

Answer 1

是的，你可以。

如果您使用内部样式表

<head>
<style>
.border-class
{
  border:thin black solid;
  margin:20px;
  padding:20px;
}
</style>
</head>
<body>

<div class="d-flex justify-content-center ">
      <form class="border-class">
        <div class="form-group row">
          <div class="col-sm-12">
            <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
          </div>
        </div>
        <div class="form-group row">
          <div class="col-sm-12">
            <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
          </div>
        </div>
        <div class="form-group row">
          <div class=" col-sm-12">
            <button type="submit" class="btn btn-primary">Sign in</button>
          </div>
        </div>
      </form>
    </div>
</body>

Answer 2

是的，您可以在表单周围放置边框。你可以通过使用内联CSS实现这一点，如下所示：

<form style="border:1px solid black">

Answer 3

.b {
  border:thin black solid;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<div class="d-flex justify-content-center ">
      <form class="b">
        <div class="form-group row">
          <div class="col-sm-12">
            <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
          </div>
        </div>
        <div class="form-group row">
          <div class="col-sm-12">
            <input type="password" class="form-control" id="inputPassword3" placeholder="Password">
          </div>
        </div>
        <div class="form-group row">
          <div class=" col-sm-12">
            <button type="submit" class="btn btn-primary">Sign in</button>
          </div>
        </div>
      </form>
    </div>

这样的东西？

希望这有帮助。

Answer 4

我知道这是一个很晚的回应，但是我有义务分享一种更“引导”的方式。只需将card和p-1类用于边界和内容与边界之间的填充。

<form class = 'card p-1'>

Answer 5

我知道这是一个很晚的回应，但是我有义务分享一种更“引导”的方式。只需将card和p-1类用于边界和内容与边界之间的填充。

<form class = 'card p-1'>

Answer 6

这是带有背景颜色的边框形式的很好的组合：

<form class = 'card p-3 bg-light'>

对我的情况很好。

我可以使用bootstrap将边框放到表单中吗？

6 个答案: