gpt4 book ai didi

html - 在 bootstrap css 中的按钮组

转载 作者:太空宇宙 更新时间:2023-11-04 13:09:36 25 4
gpt4 key购买 nike

我需要创建一个与 bootstrap css 非常相似的 btn 组类。我创建了它,但我无法填补按钮之间的空白,也无法映射按钮之间的原因。

https://jsfiddle.net/frcbn82p/

您实际上可以注意到按钮之间有一个小间隙。我怎样才能删除它。

我的CSS是

    .btn-group{
display:inline-block;
}
.btn-group button{
width:auto;

height:40px;
border:none;
background-color:#4444ee;
color:#fff;
}

最佳答案

display: inline-block; 元素上的 HTML white-space 问题,因此一种选择是删除 HTML 代码中的空格。或者您可以在 parent 上设置 font-size: 0,然后在 child 上再次更改它 Demo .或者您可以在 HTML 中使用注释 Demo .或者你可以只使用 display: flex; Demo

.btn-group{
display:inline-block;
}

.btn-group button{
width:auto;
height:40px;
border:none;
background-color:#4444ee;
color:#fff;
}
<div class="btn-group">
<button>Hello World</button><button>Hello World</button>
</div>

关于html - 在 bootstrap css 中的按钮组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35153926/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com