<div class="task-title" style=""> <button type='button' class='btn blue' onclick='funNext()'><font style='vertical-align: inherit;'>下一题</font></button> <button type='button' class='btn blue' onclick='funNext()'><font style='vertical-align: inherit;'>返 回</font></button> <%--<button class="btn blue btn-block" onclick="funNext()">下一题</button>--%> <button class="btn blue btn-block" style="display:none" onclick="funNext1()">测试</button> </div> 上面的代码,我想让button在div中居中显示
时间: 2024-04-15 22:30:12 浏览: 163
通过简单的css样式让按钮居中显示
5星 · 资源好评率100%
要让 `<button>` 元素在 `<div>` 中居中显示,你可以使用 CSS 的 flexbox 布局来实现。需要对包含按钮的 `<div>` 添加一些 CSS 样式。
以下是一种实现的方法:
```html
<div class="task-title" style="display: flex; justify-content: center; align-items: center;">
<button type="button" class="btn blue" onclick="funNext()"><font style="vertical-align: inherit;">下一题</font></button>
<button type="button" class="btn blue" onclick="funNext()"><font style="vertical-align: inherit;">返 回</font></button>
<%--<button class="btn blue btn-block" onclick="funNext()">下一题</button>--%>
<button class="btn blue btn-block" style="display:none" onclick="funNext1()">测试</button>
</div>
```
在上面的代码中,我们将 `<div>` 的样式设置为 `display: flex; justify-content: center; align-items: center;`。这样,按钮将在水平和垂直方向上都居中显示。
请注意,为了更好地控制按钮的样式和布局,你可能需要根据需要调整和添加其他 CSS 样式。
希望这可以解决你的问题!如果还有其他问题,请随时提问。
阅读全文