Bolehkah saya Mencipta Jadual Menggunakan Hanya `` dan CSS?

Cara Membuat Jadual Menggunakan Hanya

Teg dan CSS

Hanya menggunakan

HTML; elemen dan CSS, anda boleh mencipta jadual berfungsi yang serasi merentas pelayar.

Dalam coretan HTML yang disediakan, pelbagai kelas digunakan untuk menggayakan elemen. Untuk pengalaman merentas pelayar, anda boleh melaraskan CSS seperti berikut:

.div-table {
  display: table;         
  width: auto;         
  background-color: #eee;         
  border: 1px solid #666666;         
  border-spacing: 5px; /* cellspacing:poor IE support for  this */
}
.div-table-row {
  display: table-row;
  width: auto;
  clear: both;
}
.div-table-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #ccc;  
}

Dalam CSS yang dilaraskan:

• Kami telah menggantikan .divTable dengan .div-table untuk ketekalan.
• Untuk keserasian merentas pelayar, kami telah mengalih keluar border-collapse:separate; daripada .divTable.

CSS yang dikemas kini ini memastikan bahawa jadual akan dipaparkan dengan betul dalam semua penyemak imbas utama, termasuk IE7 dan ke bawah.

Atas ialah kandungan terperinci Bolehkah saya Mencipta Jadual Menggunakan Hanya `` dan CSS?. 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