Question

我是CSS的新手，我需要帮助： - 我想在div中的某些位置使用半边框，如图所示。有些人可以告诉我该怎么做。

Answer 1

您使用<fieldset>和HTML元素<legend>

见下面的例子

fieldset {
  border-radius: 5px;
}

<fieldset>
  <legend>Contact:</legend>
  Name:<input type="text">
  <br>
  Email:<input type="text">
</fieldset>

Answer 2

您可以在容器周围应用边框并填充文本背景，以便像这样截断轮廓：

<html>
  <style>
    #text {
      position: absolute;
      background: white;
      top: -15px;
      left: 10px;
      padding: 5px;
    }
    #con {
      margin: 20px;
      width: 300px;
      height: 500px;
      position: relative;
      border: 5px solid red;
      border-radius: 5px;
    }
  </style>
  <body>
    <div id="con">
       <div id="text"> SEMI BORDER ? </div>
    </div>
  </body>
</html>

div周围的半边框

2 个答案: