在一个div中如何让button按钮垂直居中

作者:落知秋 | 创建时间: 2023-04-19
很多朋友可能都明白如何让button在div中水平居中,但是垂直居中可能就不是特别明白了,今天小编就来分享下button在div中垂直居中的方法,一起来看看吧!...
在一个div中如何让button按钮垂直居中

操作方法

首先我们需要新建一个html5文件,编写html5基础代码!

新建一个div标签,在div标签下编写一个button标签。

为div标签和button标签填写基础样式代码,这里我们为了更好的查看居中情况,将div的背景设置成红色。

我们用浏览器打开页面,可以看到button在div层中的左上角位置。

接下来就是实现垂直居中的方法了,首先我们将div的行高设置成div层的高度,将button的vertical-align属性设置成middle。

刷新网页,发现button已经在div中垂直居中了。 以上就是button按钮在div中垂直居中的方法,你学会了?

温馨提示

以上为小编编程总结,希望对你有所帮助!
点击展开全文

更多推荐