ABBAをWeb上で正しく表示する方法
ABBAの2つ目のBは逆向きが正しい表記
小ネタですが。正しい表記を画像ではなくテキストで実装する方法です。デモは以下になります。
ABBA
やりかたは至って単純で、2つ目のBにspanタグで囲って、inline-blockとtransform:scaleX(-1)のCSSをあてているだけです。
A<span style="transform: scaleX(-1); display: inline-block;">B</span>BA
scaleX(-1)で鏡写し
ポイントはscaleXに-1を掛けると鏡写しになることです。これを応用すると、スライダーの矢印の画像も1つだけ用意すれば左右両方に使えます。
scaleX(-1)、上手く使うと便利ですね。