Rumah >hujung hadapan web >tutorial css >transform teks (harta CSS)

transform teks (harta CSS)

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌asal
2025-02-26 12:14:09495semak imbas

text-transform (CSS property) CSS

Penjelasan terperinci mengenai atribut text-transform Harta ini digunakan untuk mengawal penukaran kes kandungan teks elemen.

tatabahasa:

Keterangan:
<code class="language-css">text-transform: capitalize | lowercase | none | uppercase | inherit;</code>

Atribut Tentukan bagaimana kandungan teks elemen ditukar kepada huruf besar, huruf kecil, atau inisial.

text-transform Contoh:

Peraturan gaya berikut membuat tajuk menggunakan hanya huruf besar, sementara huruf awal setiap perkataan dalam tajuk dimodalkan:

h1 Nilai atribut: h2

<code class="language-css">h1 {
  text-transform: uppercase;
}
h2 {
  text-transform: capitalize;
}</code>

: Tukar huruf pertama setiap perkataan ke huruf besar;
  • capitalize : Tukar semua aksara ke huruf kecil.
  • lowercase : Tiada penukaran kes dilakukan.
  • none : Tukar semua aksara ke huruf besar.
  • uppercase : mewarisi
  • nilai atribut elemen induk.
  • inherit css text-transform atribut FAQ:

1. text-transform

Properties adalah alat yang berkuasa yang membolehkan anda mengawal kes teks. Ia boleh digunakan untuk menukar teks ke huruf besar, huruf kecil, atau memanfaatkan huruf awal setiap perkataan. Harta ini berfungsi dengan mengambil teks asal dan menukarnya berdasarkan nilai yang anda tetapkan. Sebagai contoh, jika anda menetapkan nilai kepada "huruf besar", semua huruf dalam teks akan ditukar kepada huruf besar, tanpa mengira bagaimana mereka pada asalnya ditaip.

text-transform 2.

Untuk menukar teks ke huruf besar menggunakan harta CSS text-transform, hanya tetapkan nilai harta kepada "huruf besar". Berikut adalah contoh bagaimana untuk melakukannya:

Dalam contoh ini, semua teks di dalam elemen 'P' akan ditukar kepada huruf besar. text-transform

3.

text-transform

Ya, anda boleh memanfaatkan huruf awal setiap perkataan menggunakan atribut CSS
<code class="language-css">p {
  text-transform: uppercase;
}</code>
. Untuk melakukan ini, anda perlu menetapkan nilai harta itu untuk "memanfaatkan". Berikut adalah contoh:

Dalam contoh ini, huruf awal setiap perkataan dalam elemen 'H1' akan dipermodalkan. text-transform 4.

Nilai "huruf besar" dalam text-transform CSS

menukarkan semua huruf dalam teks ke huruf besar, manakala nilai "memanfaatkan" hanya menukar huruf pertama setiap perkataan ke huruf besar. Surat -surat yang tersisa dalam perkataan akan kekal dalam keadaan menaip asalnya.
<code class="language-css">h1 {
  text-transform: capitalize;
}</code>

5. text-transform

Ya, anda boleh menukar teks ke huruf kecil menggunakan harta CSS

. Untuk melakukan ini, anda perlu menetapkan nilai harta itu kepada "huruf kecil". Berikut adalah contoh: text-transform

<code class="language-css">text-transform: capitalize | lowercase | none | uppercase | inherit;</code>
Dalam contoh ini, semua teks di dalam elemen 'Div' akan ditukar kepada huruf kecil.

6. text-transform Ya, kesan atribut CSS

boleh dibatalkan. Untuk melakukan ini, anda perlu menetapkan nilai harta itu kepada "Tiada". Ini mengembalikan teks kepada keadaan asalnya tanpa sebarang transformasi.

text-transform

7.

text-transform Ya, atribut CSS boleh digunakan untuk mana -mana elemen HTML yang mengandungi teks. Ini termasuk unsur -unsur seperti "p", "h1", "div", "span".

text-transform 8.

tidak, CSS harta tidak mengubah teks asal. Ia hanya mengubah bagaimana teks muncul di skrin. Teks asal tetap tidak berubah dalam dokumen HTML. text-transform

9.

text-transform

Tidak, anda hanya boleh menggunakan satu CSS pada satu masa

nilai atribut. Jika anda cuba menggunakan pelbagai nilai, hanya nilai terakhir yang digunakan. text-transform 10.

text-transform Ya, semua pelayar moden menyokong CSS

sifat, termasuk Chrome, Firefox, Safari, dan Edge. Walau bagaimanapun, versi lama pelayar ini mungkin tidak menyokongnya, jadi lebih baik untuk memeriksa keserasian pelayar sebelum menggunakan harta ini.

Atas ialah kandungan terperinci transform teks (harta CSS). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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
Artikel sebelumnya:CreateElement (kaedah teras dom w3c)Artikel seterusnya:tiada