CSS でテキストを水平方向に反転できますか?ハサミキャラクター(✂️)を左向きに表示するにはどうすればよいですか?

DDD
リリース: 2024-10-31 09:36:29
オリジナル
506 人が閲覧しました

Can CSS Flip Text Horizontally? How to Display the Scissors Character (✂️) Facing Left?

CSS3 によるテキストのミラーリング

質問:

CSS または CSS3 を使用してテキストをミラーリングすることは可能ですか?特に、ハサミの文字 (「✂」) を右ではなく左に表示するにはどうすればよいですか?

答え:

はい、CSS 変換を使用すると、次のことが可能になります。この効果。

  • 水平反転:
<code class="css">-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);</code>
ログイン後にコピー
  • 垂直反転:
<code class="css">-moz-transform: scale(1, -1);
-webkit-transform: scale(1, -1);
-o-transform: scale(1, -1);
-ms-transform: scale(1, -1);
transform: scale(1, -1);</code>
ログイン後にコピー

実際の例:

<code class="css">span {
  display: inline-block;
  margin: 1em;
}
.flip_H {
  transform: scale(-1, 1);
  color: red;
}
.flip_V {
  transform: scale(1, -1);
  color: green;
}</code>
ログイン後にコピー
<code class="html"><span class='flip_H'>Demo text &#9986;</span>
<span class='flip_V'>Demo text &#9986;</span></code>
ログイン後にコピー

以上がCSS でテキストを水平方向に反転できますか?ハサミキャラクター(✂️)を左向きに表示するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!