Bagaimanakah saya boleh menggantikan atribut jadual HTML5 yang tidak digunakan dengan sifat CSS?

DDD
Lepaskan: 2024-10-31 03:01:01
asal
288 orang telah melayarinya

How can I replace deprecated HTML5 table attributes with CSS properties?

Atribut HTML5 lwn. Sifat CSS: Perjalanan Pemodenan

Dalam dunia pembangunan web, HTML5 telah merevolusikan cara kami mencipta jadual, menghapuskan beberapa sifat yang dahulunya penting. Seperti yang anda temui dalam Visual Studio, cellpadding, cellpcing, vaalign dan align bukan lagi atribut jadual HTML5 yang sah.

Untuk menggantikan atribut ini dan mengekalkan pemformatan jadual yang diingini, sifat CSS datang untuk menyelamatkan. Begini caranya:

Menerap padding sel dengan padding CSS:

Gunakan padding sifat CSS untuk menambah ruang antara sel jadual seperti yang dilakukan padding sel. Contohnya:

<code class="css">th, td {
  padding: 5px;
}</code>
Salin selepas log masuk

Meniru jarak sel dengan CSS runtuh sempadan dan jarak sempadan:

jarak sel digantikan dengan keruntuhan sempadan dan jarak sempadan. Jika anda ingin mengekalkan ruang antara sel jadual, tetapkan keruntuhan sempadan untuk memisahkan dan tentukan jarak yang dikehendaki dengan jarak sempadan:

<code class="css">table {
  border-collapse: separate;
  border-spacing: 5px;
}</code>
Salin selepas log masuk

Untuk mengalih keluar jarak sama sekali (bersamaan dengan cellspacing="0"), gunakan:

<code class="css">table {
  border-collapse: collapse;
  border-spacing: 0;
}</code>
Salin selepas log masuk

Menggantikan valign dengan CSS vertical-align:

Guna vertical-align untuk mengawal penjajaran menegak kandungan sel jadual, serupa dengan valign:

<code class="css">th, td {
  vertical-align: top;
}</code>
Salin selepas log masuk

Memusatkan jadual dengan jidar CSS:

Untuk memusatkan jadual pada halaman, gantikan jajaran dengan jidar:

<code class="css">table {
  margin: 0 auto;
}</code>
Salin selepas log masuk

Dengan menggunakan ini Ciri CSS, anda boleh meniru fungsi padding sel, ruang sel, penjajaran dan penjajaran dalam HTML5, memastikan jadual anda kekal menarik secara visual dan mematuhi piawaian web moden.

Atas ialah kandungan terperinci Bagaimanakah saya boleh menggantikan atribut jadual HTML5 yang tidak digunakan dengan sifat CSS?. 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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan