在网站设计中，按钮是重要的元素之一，而样式图片的添加可以更好地呈现按钮的效果。本文将介绍如何将样式图片在按钮中居中。
首先，在HTML中创建一个按钮并添加样式图片的代码如下：
<button class="btn"><img src="example.png" alt="样式图片">按钮</button>
然后在CSS中添加以下代码，使图片垂直水平居中：
.btn{display: flex;justify-content: center;align-items: center;}.btn img{margin-right: 5px;vertical-align: middle;}以上代码中，
display: flex;使按钮变为弹性箱子，justify-content: center;和align-items: center;分别将内容水平和垂直居中。margin-right: 5px;是为了让文本和图片之间有一定的间距，vertical-align: middle;使图片垂直居中。这样，样式图片就成功地居中在按钮中，给用户更好地视觉体验。
总之，样式图片的居中对于按钮的设计非常重要，通过一定的CSS代码可以轻松实现。
上一篇：css按钮特效源代码
下一篇：javascript中加表格
