项目中涉及到了划入激活切换图片,我也是上网查了查才发现 这么简单!
要求:划入切换图标
<!-- 整个按钮结构 -->
<el-button
type="success"
class="buttonEnter txlhover"
@click="addressBookClick"
>
<div class="imgText">
<img
src="static/img/txl1.png"
alt=""
style="width: 30px; height: 30px;"
/>
<p style="padding-top: 4px; padding-left: 5px;">通讯录</p>
</div>
</el-button>
我就不放按钮样式的代码啦!
//第一个按钮的 hover 样式
// 效率工具图标划过样式
.txlhover:hover {
.imgText img {//通讯录
content: url(/static/img/txl.png);
}
}
就这,简洁易懂,注意图片路径呀!
告辞告辞!