jquery mobile是一款优秀的移动设备UI框架，其中最常用的就是按钮组件。这个组件非常强大，可以用于各种场景，包括导航、表单、列表等等。 然而，有时候默认的样式并不能满足我们的需求，这时我们就需要自定义按钮样式了。下面，我们来介绍几种自定义按钮的方式。 1. 修改主题色 修改主题色是最简单的自定义方式，只需要修改按钮的data-theme属性即可。比如，我们想把一个按钮的主题色改成红色，可以这样写：

<a href="#" class="ui-btn ui-btn-b ui-corner-all" data-theme="a">按钮</a>

其中，ui-btn-b表示按钮的默认主题色，可以改成其他任何颜色，比如ui-btn-a、ui-btn-c、ui-btn-d等等。 2. 使用伪元素 我们还可以使用CSS伪元素来自定义按钮的样式。比如，我们想在按钮左侧增加一个图标，可以这样写：

.custom-btn::before {
content: "";
display: inline-block;
background-image: url("icon.png");
background-size: 20px 20px;
width: 20px;
height: 20px;
margin-right: 10px;
}

这里的.custom-btn是我们自定义按钮的类名，::before表示在按钮内容前插入伪元素。我们可以通过修改background-image来实现不同的图标。 3. 使用自定义图片 除了使用CSS伪元素，我们还可以使用自定义图片来实现按钮样式的改变。比如，我们想把一个按钮改成一个圆角矩形，可以这样写：

<a href="#" class="ui-btn ui-corner-all"><img src="button.png"></a>

这里的button.png就是我们自己制作的圆角矩形图片，只需要通过CSS来设置按钮的边框样式即可。 总之，jquery mobile的按钮组件非常灵活，可以通过众多方式来实现自定义效果。以上只是其中的几种方法，大家可以根据自己的需求来选择最合适的方式。