美文网首页
css布局技巧-【文字居中,左右实线】

css布局技巧-【文字居中,左右实线】

作者: 飘空鱼 | 来源:发表于2017-06-14 22:04 被阅读0次

    效果:

    Paste_Image.png

    解决方案:

    1.html5标签

      <pre><code>`
            代码:
           css:
           fieldset{
             border: none;
             border-top: 1px solid red;
             text-align: center; 
           }
           legend{
             padding: 0 10px;
           }
           html:
           <fieldset>
            <legend>健康信息</legend>
          </fieldset>
      `</code></pre>
    

    2.div模拟:
    <pre><code>代码: css: .title{ position: relative; width: 100%; } .tx-center{ width: 160px; margin: 0 auto; text-align: center; background-color: #fff; font-size: 24px; } html: <div class="title"> <div class="tx-center">热门点评任务</div> </div></code></pre>

    相关文章

      网友评论

          本文标题:css布局技巧-【文字居中,左右实线】

          本文链接:https://www.haomeiwen.com/subject/ahvhettx.html