Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menggayakan Komponen JSF dengan Berkesan dengan Tanda titik dalam ID HTML Dijananya?

Bagaimanakah Saya Boleh Menggayakan Komponen JSF dengan Berkesan dengan Tanda titik dalam ID HTML Dijananya?

Barbara Streisand
Lepaskan: 2024-12-17 00:55:25
asal
415 orang telah melayarinya

How Can I Effectively Style JSF Components with Colons in Their Generated HTML IDs?

Bekerja dengan ID HTML Dijana JSF dengan Tanda Titik dalam Pemilih CSS

Apabila bekerja dengan komponen Java Server Faces (JSF), anda mungkin menghadapi masalah menggayakannya menggunakan pemilih CSS kerana titik bertindih (:) dalam ID elemen HTML yang dijana JSF. Titik bertindih ini mewakili permulaan pemilih kelas pseudo dalam CSS, yang membawa kepada ralat sintaks.

Melepaskan Diri dari Kolon

Penyelesaian utama melibatkan melarikan diri daripada aksara kolon. Ini boleh dicapai dengan menambahkan garis serong ke belakang () sebelum titik bertindih:

#phoneForm\:phoneTable {
    background: pink;
}
Salin selepas log masuk

Sebagai alternatif, anda boleh menggunakan kod hex 3A diikuti dengan ruang belakang:

#phoneFormA phoneTable {
    background: pink;
}
Salin selepas log masuk

Pendekatan Alternatif

Selain melarikan diri dari kolon, pertimbangkan perkara berikut alternatif:

Membalut dalam Elemen HTML Biasa

Enkapsulasi komponen JSF dalam elemen HTML biasa dan gayakannya melalui ID elemen induk.

<h:form>
Salin selepas log masuk
#phoneField table {
    background: pink;
}
Salin selepas log masuk

Menggunakan CSS Kelas

Tetapkan kelas CSS kepada komponen JSF dan bukannya ID:

<h:dataTable>
Salin selepas log masuk
.pink {
    background: pink;
}
Salin selepas log masuk

Mengubah suai UinamingContainer Separator

Bermula dengan JSF 2.x, anda boleh menukar pemisah UINamingContainer dengan menambahkan konteks parameter ke web.xml:

<context-param>
    <param-name>javax.faces.SEPARATOR_CHAR</param-name>
    <param-value>- // Change to hyphen (-) instead of colon</param-value>
</context-param>
Salin selepas log masuk

Ini membolehkan anda menggunakan aksara berbeza sebagai pemisah, menghapuskan isu bertindih.

Lumpuhkan Prapending ID Borang

Dalam JSF 1.2 atau lebih baru, lumpuhkan pendahuluan automatik ID borang dengan menetapkan prependId kepada false:


    <h:dataTable>
Salin selepas log masuk

Ini membolehkan anda menggunakan ID tanpa awalan borang. Nota: Pendekatan ini mungkin merosakkan fungsi AJAX, jadi ia tidak disyorkan.

Kesimpulan

Apabila menggayakan komponen JSF, pertimbangkan penyelesaian di atas untuk dikendalikan titik bertindih dalam ID HTML dan mencapai penggayaan CSS yang diingini.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggayakan Komponen JSF dengan Berkesan dengan Tanda titik dalam ID HTML Dijananya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan