我在点击时旋转一个按钮:
<button class="btn" type="button">Go</button>
CSS:
.btn:focus {
transform: rotate(180deg);
}
现在的问题是 txt
也会在 btn
点击时旋转。如何在单击按钮时不旋转 txt
或旋转 360?
最佳答案
将按钮文本包裹在 span
中,然后将其在 button
的 :focus
上再旋转 180 度:
.btn:focus {
transform: rotate(180deg);
}
.btn:focus span {
display: inline-block;
transform: rotate(180deg);
}
<button class="btn" type="button"><span>Go</span></button>
关于html - 仅旋转按钮而不是按钮单击时的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52707370/