bootstrap怎么让button和input在一行
1个回答
2016-09-29 · 做真实的自己 用良心做教育
千锋教育
千锋教育专注HTML5大前端、JavaEE、Python、人工智能、UI&UE、云计算、全栈软件测试、大数据、物联网+嵌入式、Unity游戏开发、网络安全、互联网营销、Go语言等培训教育。
向TA提问
关注
展开全部
通常选择的方法是将button 和文字分别置于一个<span>中。
因为<span>在未设置 display:block的时候是不会想div那样自动换行的,因此button和文字很自然就排成一行了, 而且两个span中的文字会自动对齐。
参考代码如下:
.long-btn {
height: 40px;
width: 100px;
text-align:center;
line-height:40px;
background: url(img/mail-tpl-view.gif) no-repeat;
font-size:20px;
}
</style>
<div>
<span class="button-span">
<a class="long-btn" href="##">大按钮</a>
</span>
<span class="text">
小文字
</span>
</div>
因为<span>在未设置 display:block的时候是不会想div那样自动换行的,因此button和文字很自然就排成一行了, 而且两个span中的文字会自动对齐。
参考代码如下:
.long-btn {
height: 40px;
width: 100px;
text-align:center;
line-height:40px;
background: url(img/mail-tpl-view.gif) no-repeat;
font-size:20px;
}
</style>
<div>
<span class="button-span">
<a class="long-btn" href="##">大按钮</a>
</span>
<span class="text">
小文字
</span>
</div>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询