如何在输入文本旁边显示按钮（例如＆＃39; Medium＆＃39;创建故事）

Question

我想使按钮显示如下图所示。你们有建议吗？

中创故事截图：

Answer 1

尝试使用css来实现按钮样式：

HTML：

<span class="p-btn">+</span>

CSS：

span.p-btn {
    border: solid 1px;
    height: 36px;
    width: 36px;
    border-radius: 100%;
    float: left;
    line-height: 35px;
    text-align: center;
    font-size: 23px;
    cursor: pointer;
}

跨度（按钮）后，您可以添加文字。

Answer 2

.my.btn:focus,
.my.btn:hover,
.my.btn{

    background:none;
    border:none;
    box-shadow:none;
    color:gray;
    padding: 0px;
}

.myInput{
    border: none;
    border-bottom: 1px solid #808080;
}
.myInput:focus{
    border: none; outline:none;
    border-bottom: 1px solid #808080;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>


<div>
<button class="my btn glyphicon glyphicon-plus-sign"></button>
<input type="text" class="myInput">  
</div>