property display CSS

Definisi dan penggunaan

Atribut display menentukan jenis kotak papan yang harus dihasilkan oleh elemen.

Penerangan

Atribut ini digunakan untuk menentukan jenis kotak papan yang dihasilkan oleh elemen dalam pengaturan tata letak. Untuk jenis dokumen seperti HTML, penggunaan display yang tidak berhati-hati boleh berbahaya kerana boleh melanggar struktur papan yang telah ditetapkan di HTML. Untuk XML, kerana XML tidak mempunyai struktur ini secara baku, semua display adalah penting.

Keterangan:Ada nilai compact dan marker di CSS2, tetapi kerana kekurangan sokongan yang luas, sudah dihapus dari CSS2.1.

Lihat juga:

Panduan CSS:Pemasaan CSS

Panduan HTML DOM:Atribut display

Contoh

Buat paragraf mempunyai kotak dalam baris:

p.inline
  {
  display:inline;
  }

Coba sendiri

Sintaks CSS

display: value;

Nilai atribut

Nilai Penerangan
none Elemen ini tidak akan dipaparkan.
block Elemen ini akan dipaparkan sebagai elemen blok, dan akan ada tab di depan dan belakang elemen.
inline Lalai. Elemen ini akan dipaparkan sebagai elemen inline, tanpa tab atau paragraf di depan dan belakang elemen.
inline-block Elemen dalam baris (nilai yang ditambahkan di CSS2.1).
list-item Elemen ini akan dipaparkan sebagai senarai.
run-in Elemen ini akan dipaparkan sebagai elemen blok atau elemen inline berdasarkan konteks.
compact Ada nilai compact di CSS, tetapi kerana kekurangan sokongan yang luas, sudah dihapus dari CSS2.1.
marker Ada nilai marker di CSS, tetapi karena kekurangan dukungan yang luas, sudah dihapus dari CSS2.1.
table Elemen ini akan ditampilkan sebagai tabel blok (seperti <table>), dengan paragraf pindah di depan dan belakang tabel
inline-table Elemen ini akan ditampilkan sebagai tabel inline (seperti <table>), tanpa paragraf pindah di depan dan belakang tabel
table-row-group Elemen ini akan ditampilkan sebagai grup baris satu atau lebih (seperti <tbody>)
table-header-group Elemen ini akan ditampilkan sebagai grup baris satu atau lebih (seperti <thead>)
table-footer-group Elemen ini akan ditampilkan sebagai grup baris satu atau lebih (seperti <tfoot>)
table-row Elemen ini akan ditampilkan sebagai baris tabel satu atau lebih (seperti <tr>)
table-column-group Elemen ini akan ditampilkan sebagai grup kolom satu atau lebih (seperti <colgroup>)
table-column Elemen ini akan ditampilkan sebagai kolom sel (seperti <col>)
table-cell Elemen ini akan ditampilkan sebagai sel tabel (seperti <td> dan <th>)
table-caption Elemen ini akan ditampilkan sebagai judul tabel (seperti <caption>)
inherit Ditetapkan supaya nilai atribut display diwarisi dari elemen orang tua.

Detil Teknologi

Nilai Default: inline
Inheritsi: no
Versi: CSS1
Sintaksu JavaScript: object.style.display="inline"

Contoh TIY

Bagaimana menampilkan elemen sebagai elemen inline
Contoh ini menunjukkan bagaimana menampilkan elemen sebagai elemen inline.
Bagaimana menampilkan elemen sebagai elemen blok
Contoh ini menunjukkan bagaimana menampilkan elemen sebagai elemen blok.

Dukungan peramban

Angka di tabel menunjukkan versi peramban pertama yang mendukung atribut ini penuh.

Chrome IE / Edge Firefox Safari Opera
4.0 8.0 3.0 3.1 7.0

Keterangan:Jika dinyatakan !DOCTYPE, Internet Explorer 8 (dan versi yang lebih tinggi) mendukung nilai atribut "inline-table", "run-in", "table", "table-caption", "table-cell", "table-column", "table-column-group", "table-row", "table-row-group", serta "inherit".