Style display Property

Przykład

Ustaw <div> element, który nie jest wyświetlany:

document.getElementById("myDIV").style.display = "none";

Definicja i Wykorzystanie

Zestawy właściwości wyświetlania lub zwraca typ wyświetlania elementu.

Elementy HTML są przeważnie "inline" lub "block" elementy: Element inline został pływających treści na jego lewej i prawej stronie. Element blok wypełnia całą linię, a nie mogą być wyświetlane na jego lewej lub prawej stronie.

Nieruchomość wyświetlacz pozwala również autorowi do pokazania lub ukrycia elementu. Jest ona podobna do widoczności nieruchomości. Jednakże, jeśli wyświetlacz można ustawić: Brak, ukrywa cały element, podczas gdy widoczność: ukryta oznacza, że zawartość elementu będzie niewidoczny, ale element pozostaje w swojej pierwotnej pozycji i wielkości.

Tip: Jeśli element jest elementem bloku, jego typ wyświetlacza może również zostać zmieniony z właściwością pływaka.

Wsparcie przeglądarka

Nieruchomość wyświetlacz jest dostępna we wszystkich głównych przeglądarkach.

Składnia

Zwraca właściwości wyświetlania:

object .style.display

Ustaw właściwość wyświetlania:

object .style.display= wartości nieruchomości

Wartość	Opis
block	Element jest wyświetlany jako element blokowy
compact	Element jest przedstawiany jako poziom bloku lub wcięcia elementu. Zależy od kontekstu
flex	Element jest przedstawiany jako elastycznego pudełka blokowego. Nowego w CSS3
inherit	Wartość właściwości wyświetlacza jest dziedziczona z elementu nadrzędnego
inline	Element jest wyświetlany jako elementu liniowego. Jest to domyślny
inline-block	Element jest wyświetlany jako pudełko pakietowej wewnątrz skrzynce inline
inline-flex	Element jest wyświetlany jako flex polu inline poziomu. Nowego w CSS3
inline-table	Element jest jako tabela inline (na przykład <tabela>), bez przerwy linia przed, albo po stole
list-item	Element jest wyświetlany w postaci listy
marker	Wartość ta określa zawartość przed lub po polu się marker (platformach przed i. Po pseudoelementów innym przypadku ta wartość jest identyczna z „inline”)
none	nie będą wyświetlane elementem
run-in	Element jest wyświetlany jako poziom bloku lub wcięcia elementu. Zależy od kontekstu
table	Element jest wyświetlany jako blok tabeli (na przykład <tabela>), z przerwą linii przed i po stole
table-caption	Element jest przedstawiany jako podpisu tabeli (na przykład <podpis>)
table-cell	Element jest przedstawiany jako komórki tabeli (na przykład <td> i <p>)
table-column	Element jest przedstawiany jako kolumny komórek (like <col>)
table-column-group	Element jest wyświetlany jako grupy jednego lub więcej znaków (like <colgroup>)
table-footer-group	Element jest przedstawiany jako wiersz tabeli stopki (like <tfoot>)
table-header-group	Element jest przedstawiany jako nagłówku tabeli (like <thead>)
table-row	Element jest przedstawiany jako wiersz tabeli (na przykład <tr>)
table-row-group	Element jest wyświetlany jako grupy jednego lub więcej rzędach (like <tbody>)
initial	Ustawia tę właściwość na wartość domyślną. Przeczytaj o początkowy
inherit	Dziedziczy nieruchomość od swojego rodzica. Przeczytaj o dziedziczyć

Szczegóły techniczne

Domyślna wartość:	inline
Zwracana wartość:	Ciąg reprezentujący typ wyświetlania elementu
Wersja CSS	CSS1

Więcej przykładów

Przykład

Różnica między wyświetlaczem i własności nieruchomości Widoczność:

function demoDisplay() {
document.getElementById("myP1").style.display = "none";
}

function demoVisibility() {
document.getElementById("myP2").style.visibility = "hidden";
}

Spróbuj sam "

Przykład

Różnica między "inline" , "block" i "none" :

function myFunction(x) {
    var whichSelected = x.selectedIndex;
    var sel = x.options[whichSelected].text;
    var elem = document.getElementById("mySpan");
    elem.style.display = sel;
}

Spróbuj sam "