首页 > 代码库 > 高度30px，宽度自适应，点线在文字中间
高度30px，宽度自适应，点线在文字中间
<style>
.div{ position: relative; width: 100%; height: 30px; background: #ffff00}
.div b{ display: block; height: 0; border-bottom: 1px dashed #ff0000; width:100%}
.f1{ float: left; position: relative; left: 50%}
.f1 span{ float: left; position: relative; height: 30px; line-height: 30px; background: pink;
padding: 0 20px;font-size: 14px; left: -50%; margin-top: -15px;}
.div b{ display: block; height: 0; border-bottom: 1px dashed #ff0000; width:100%}
.f1{ float: left; position: relative; left: 50%}
.f1 span{ float: left; position: relative; height: 30px; line-height: 30px; background: pink;
padding: 0 20px;font-size: 14px; left: -50%; margin-top: -15px;}
</style>
<div class="div">
<b></b>
<div class="f1">
<span>亲爱的你好哦</span>
</div>
</div>
<b></b>
<div class="f1">
<span>亲爱的你好哦</span>
</div>
</div>
高度30px，宽度自适应，点线在文字中间
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。