Question

<pre>
  <head>
    <style>
       body{
        background-color: blue;
       }
      .a
      {
        background-color: white;
        display: block;
        margin: auto;
         border-color: white;
         border-style: solid;
         border-radius: 10px;
        text-align: center;
        border-color: black;
        border-radius: 2px;
        width: 400px;
        height: 600px;
      }
    </style>
  </head>
  <body>
    <div class="a">
      <h1>SignUp</h1>
    </div>
  </body>
</pre>

我不明白为什么border属性不起作用，请向我解释。（我删除了基本标签，因为网站上说代码太多了。）

Answer 1

问题是：

border-color: white;
border-color: black;

您要设置两次边框颜色。

两次设置相同的属性是非常不好的做法。一旦删除其中任何一个，代码就会按预期工作。

Answer 2

您编写2次相同的代码

border-color: white;
border-radius: 10px;
border-color: black;
border-radius: 2px;

客户端（网络浏览器）将用最后一个代码替换第一个代码，客户端将在其中运行最后一个代码

border-color: black;
border-radius: 2px;

您可以删除其中的每一个，也可以使用

border: [size] [style] [color];

示例：

border: 10px solid black;

避免重复输入代码。

Answer 3

您是否正在尝试做这样的事情？

lazy var scrollView: UIScrollView = {
        let scView = UIScrollView()
        scView.contentInset = UIEdgeInsets(top: 0, left: 12, bottom: 0, right: 12)
        scView.showsHorizontalScrollIndicator = false
        scView.translatesAutoresizingMaskIntoConstraints = false
        scView.isUserInteractionEnabled = true
        scView.delaysContentTouches = false
        return scView
    }()

 body
    {
     background-color: blue;
    }

    div.border
    {
     background-color: white;
     display: block;
     margin: auto;
     border: 5px solid black;
     border-style: solid;
     border-radius: 10px;
     text-align: center;
     width: 400px;
     height: 600px;
    }

我不明白为什么border属性不起作用

3 个答案: