最近进行二次开发的时候有个图片用背景图要旋转一定角度。
下图中如果只给.question添加背景通过CSS3的transfrom rotate肯定是会影响文字的展示。
所以把背景图放到伪类中进行旋转就可以完美解决这个问题了，话不多说，上代码。
.des-item-7 .inner-box .question{ position:relative; font-size: 16px; font-family: CenturyGothic; font-weight: 400; color: #000000; cursor: pointer; } .des-item-7 .inner-box .question::after{ content:''; position:absolute; right:0; top:50%; width:15px; height:9px; transform:translate(0,-50%); display:block; background-image: url('{
{ "question_arrow.jpg" | asset_url}}'); background-repeat: no-repeat; background-position:right 0 center; } .des-item-7 .inner-box .active::after{ transition:all 0.5s; transform: rotate(180deg); }
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/211813.html原文链接：https://javaforall.net
