Rumah > hujung hadapan web > tutorial css > Bolehkah CSS Flip Teks Secara Mendatar? Bagaimana untuk Memaparkan Watak Gunting (✂️) Menghadap Kiri?

Bolehkah CSS Flip Teks Secara Mendatar? Bagaimana untuk Memaparkan Watak Gunting (✂️) Menghadap Kiri?

DDD
Lepaskan: 2024-10-31 09:36:29
asal
657 orang telah melayarinya

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

Mencerminkan Teks dengan CSS3

Soalan:

Adakah sesuai untuk mencerminkan teks menggunakan CSS atau CSS3? Terutamanya, bagaimana anda boleh memaparkan aksara gunting ("✂") menghadap kiri dan bukannya kanan?

Jawapan:

Ya, transformasi CSS memberi anda keupayaan untuk mencapai kesan ini.

  • Flip Mendatar:
<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>
Salin selepas log masuk
  • Flip Menegak:
<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>
Salin selepas log masuk

Contoh Langsung:

<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>
Salin selepas log masuk
<code class="html"><span class='flip_H'>Demo text &#9986;</span>
<span class='flip_V'>Demo text &#9986;</span></code>
Salin selepas log masuk

Atas ialah kandungan terperinci Bolehkah CSS Flip Teks Secara Mendatar? Bagaimana untuk Memaparkan Watak Gunting (✂️) Menghadap Kiri?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan