Pemformatan jadual-tutorial css-php.cn

Pemformatan jadual

Christopher Nolan

Lepaskan： 2025-02-26 11:06:17

asal

201 orang telah melayarinya

Jadual HTML: Pemahaman yang mendalam tentang kerumitan dan gaya

Artikel ini membincangkan kerumitan jadual HTML dan penerapan gaya CSS secara mendalam. Jadual HTML mengandungi unsur -unsur seperti tajuk, kumpulan baris dan kumpulan lajur, dan perintah rendering adalah: Jadual, kumpulan lajur, lajur, kumpulan baris, kumpulan baris, dan sel. Model jadual HTML berpusat dalam tingkah laku dan terkandung dalam baris pada struktur sel.

Table Formatting

Objek pemformatan jadual

CSS menyediakan sepuluh nilai yang berkaitan dengan display nilai atribut untuk mengawal gaya jadual. Nilai-nilai ini juga boleh digunakan untuk unsur-unsur lain, tetapi unsur-unsur yang berkaitan dengan jadual tanpa nama mungkin perlu dijana untuk diberikan dengan betul.

Lebar jadual dan lajurnya ditentukan oleh dua algoritma: algoritma susun atur jadual tetap dan algoritma susun atur jadual automatik. Yang pertama tidak terjejas oleh kandungan sel meja, manakala yang terakhir memerlukan memeriksa setiap sel di dalam jadual, yang boleh memakan masa untuk jadual besar.

CSS2 mentakrifkan dua model yang menjadikan sempadan objek jadual dalaman: model sempadan berasingan dan model sempadan yang dilipat. Model sempadan yang dipisahkan hanya membolehkan sel -sel dan jadual mempunyai sempadan, manakala model sempadan keruntuhan membolehkan sempadan baris, kumpulan baris, lajur, kumpulan lajur, dan jadual diri untuk bertindih dengan cara yang kompleks.

Table Formatting

Rendering sempadan berasingan

Table Formatting

Rendering sempadan dilipat

sifat lajur dan elemen kumpulan lajur

Hanya beberapa sifat yang boleh digunakan untuk elemen dengan display nilai atribut table-column atau table-column-group: atribut sempadan (hanya dalam model sempadan yang runtuh), atribut latar belakang (sel dan baris mempunyai latar belakang telus), atribut lebar dan nilai atribut penglihatan collapse (nilai penglihatan lain akan diabaikan).

Algoritma lebar jadual

) Saiz jadual akan ditentukan oleh kandungannya. Anda boleh menggunakan

dan auto untuk menetapkan margin-left untuk memusatkan jadual secara mendatar. margin-right auto Terdapat dua algoritma untuk menentukan lebar lajur jadual: algoritma susun atur jadual tetap dan algoritma susun atur jadual automatik, yang ditentukan oleh atribut

(nilai adalah

dan table-layout masing -masing, dan nilai awal ialah fixed). Jika lebar jadual ditentukan sebagai auto, algoritma susun atur jadual automatik biasanya digunakan. Untuk jadual peringkat blok (auto ditetapkan ke auto), ejen pengguna boleh, tetapi tidak perlu menggunakan algoritma susun atur jadual tetap. display table Dalam algoritma susun atur jadual tetap, lebar lajur dan jadual tidak dipengaruhi oleh kandungan sel -sel meja. Lebar setiap lajur ditentukan seperti berikut:

tidak ditetapkan pada lebar lajur. auto Lebar sel baris pertama dengan lebar tidak
auto Lajur yang tinggal sama rata memperuntukkan ruang mendatar yang tinggal (tolak mana -mana sempadan atau jarak sel).

Jangan menghilangkan sel!

Sejak sel baris pertama digunakan untuk menentukan lebar lajur, jika algoritma susun atur jadual tetap digunakan, tiada sel harus ditinggalkan dari baris pertama. Tingkah laku dalam kes ini tidak ditakrifkan dalam spesifikasi CSS2.1.

Algoritma susun atur jadual automatik biasanya memerlukan pelbagai traversals. Spesifikasi CSS2.1 mencadangkan algoritma untuk menentukan lebar lajur, tetapi ejen pengguna tidak perlu menggunakannya. Algoritma memeriksa setiap sel di seluruh jadual dan mengira lebar minimum dan maksimum yang diperlukan untuk menjadikan setiap sel. Nilai -nilai ini kemudiannya digunakan untuk menentukan lebar setiap lajur, yang seterusnya dapat menentukan lebar jadual itu sendiri.

Oleh kerana setiap sel perlu diperiksa, algoritma susun atur jadual automatik boleh memakan masa untuk jadual dengan sejumlah besar baris dan/atau lajur.

algoritma ketinggian jadual

Jika nilai atribut ketinggian jadual tidak

dan ketinggian yang ditentukan adalah berbeza dari jumlah ketinggian baris (ditambah sempadan atau jarak sel), tingkah laku tidak ditentukan. Nilai peratusan atribut ketinggian baris, kumpulan baris, dan sel tidak ditakrifkan. Hartanah

setiap sel menentukan bagaimana ia diselaraskan dalam baris. Hanya auto, vertical-align dan baseline nilai dibenarkan. Untuk apa -apa nilai lain, top akan digunakan. bottom middle baseline sempadan objek meja

Terdapat dua model yang menjadikan sempadan objek jadual dalaman dalam CSS2: model sempadan pemisahan dan model sempadan keruntuhan. Anda boleh menggunakan atribut untuk menetapkan nilainya kepada

(nilai awal) atau

untuk memilih model pilihan. border-collapse separate Dalam model sempadan yang dihancurkan, hanya sel (dan jadual itu sendiri) boleh mempunyai sempadan; Sempadan ditarik di sekitar sel, dipisahkan oleh jarak menegak dan mendatar yang ditentukan oleh atribut collapse. Dalam ruang antara sempadan sel, latar belakang baris, kumpulan baris, lajur, dan kumpulan lajur tidak dapat dilihat. Hanya latar belakang jadual yang dapat dilihat di jarak sel.

Apabila harta

border-spacing ditetapkan kepada

, sel -sel tidak dipisahkan, dan sempadan mereka (dan sempadan baris, kumpulan baris, lajur, kumpulan lajur dan jadual itu sendiri) akan runtuh dalam keadaan yang agak rumit cara (atau bertindih).

Ciri -ciri border-collapse collapse dan

diabaikan apabila menggunakan model sempadan yang runtuh.

border-spacing empty-cells (Berikut adalah bahagian FAQ. Oleh kerana batasan ruang, hanya tajuk yang dikekalkan di sini. Sila rujuk teks asal untuk Kandungan Lengkap)