Question

我需要在h1标签后面显示边框，但不要在文本本身后面。也。在中心显示文本。目前你可以看到“为什么我们”文字不在中心。或任何其他工作来做所需的事情。

<div  class="lineb"><h1 class="hbord">What <span>we</span> can do</h1><div class="cls"></div></div>

目前.lineb有灰色的边框底部，而.hbord有白色的边框底部，目前可以达到我的目的，但不完全是因为“为什么我们”没有居中。

Answer 1

试试这个

<强> HTML

<h1 class="one"><span>Heading Number One</span></h1>
<h1 class="one"><span>Heading Number One</span></h1>

<强> CSS

 h1 {
    position: relative;
    margin-top: 20px; text-align: center; 
    font-size:25px
  }

  h1.one { margin-top: 0; }

  h1.one:before {
    content: "";
    display: block;
    border-top: solid 1px black;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    z-index: 1;
  }  
  h1.one span {
    background: #fff;
    padding: 0 20px;
    position: relative;
    z-index: 5;
  }

<强> DEMO

显示2个边框，文本位于中心

1 个答案: