html - 如何用按钮画一条线在线的中心

Question

我想<hr>在 CSS 中画一条线。在线的中心有一个按钮，可以将那条线从中间切开。那么如何在css中实现这个效果呢？

Answer 1

给margin-bottom你的减号button。像这样写：

button{
 margin-bottom:-20px;
 position:relative;
} 

Answer 2

CSS

.button-holder{display:block; height:30px; border-bottom:1px solid #ff0000; position:relative; text-align:center;}
input{position:absolute; bottom:-13px;}

HTML

<div class="button-holder">
    <input type="button" value="button in the middle of HR" />
</div>