x
CSS Display
Lastnost prikaza je ena najpomembnejših lastnosti, pče ne, kar najpomembnejša za nadzor postavitve. Lastnost prikaza se uporablja za določanje, kako je element prikazan na spletni strani. Vsak HTML element ima privzeto prikazano lastnost, odvisno od vrste elementa. Privzeta vrednost prikaza za večino elementov je block ali inline. Lastnost prikaza se uporablja za spreminjanje privzetega obnašanja prikaza HTML elementov. Elementi na ravni bloka se VEDNO začne v novi vrstici in zavzame celotno razpoložljivo širino. Element inline se NE začne v novi vrstici in zavzame le toliko širine, kolikor je potrebno. CSS lastnost display ima veliko vrednost, poglejmo si jih:
| display: block | Prikaže element kot element bloka. | Glej primer |
| display: contents | Poskrbi, da vsebnik izgine. | Glej primer |
| display: flex | Prikaže element kot flex vsebnik na ravni bloka. | Glej primer |
| display: grid | Prikaže element kot vsebnik mreže na ravni bloka. | Glej primer |
| display: inherit | Podeduje to lastnost od nadrejenega elementa. | Glej primer |
| display: initial | Lastnost nastavi na privzeto vrednost. | Glej primer |
| display: inline | Prikaže element kot element v vrstici. | Glej primer |
| display: inline-block | Prikaže element kot vsebnik blokov na ravni vrstice. | Glej primer |
| display: inline-flex | Prikaže element kot vsebnik flex v vrstici. | Glej primer |
| display: inline-grid | Prikaže element kot vsebnik mreže na ravni vrstice. | Glej primer |
| display: inline-table | Element je prikazan kot tabela na ravni vrstice. | Glej primer |
| display: list-item | Element se obnaša kot seznam. | Glej primer |
| display: none | Element je popolnoma odstranjen. | Glej primer |
| display: run-in | Prikaže element kot blok ali v vrstici, odvisno od konteksta. | Glej primer |
| display: table | Element se obnaša kot tabela. | Glej primer |
| display: table-caption | Element se obnaša kot element <caption>. | Glej primer |
| display: table-cell | Element se obnaša kot element <td>. | Glej primer |
| display: table-column | Element se obnaša kot element <col>. | Glej primer |
| display: table-column-group | Element se obnaša kot element <colgroup>. | Glej primer |
| display: table-footer-group | Element se obnaša kot element <tfoot>. | Glej primer |
| display: table-header-group | Element se obnaša kot element <thead>. | Glej primer |
| display: table-row | Element se obnaša kot element <tr>. | Glej primer |
| display: table-row-group | Element se obnaša kot element <tbody>. | Glej primer |
