Definition af display

Siden er opdateret 23.1.2008

Eksempel på display:block

Eksempel på tekstlinks, der fremtræder som tabelcelle (uanset længden på linkteksten har linkfeltet samme længde - her 140px):

a.mlink:link,a.mlink:visited,a.mlink:active {
font-family: verdana,arial,sans-serif;
color: #000080;
display: block;
width: 140px;
text-decoration: none;
font-size: 10px;
padding: 3px;
background: inherit;
font-weight: normal;
}

a.mlink:hover {
background: blue;
color: white;
}

Herover vises css-koden og herunder vises, hvordan linket kodes i html. Bemærk, at der ikke skal indsættes tvungne linjeskift, hvis menuen er lagt i en <div> med bredde svarende til lidt over linkbredden:

<a class="mlink" href="side1.htm">Side 1</a>
<a class="mlink" href="side2.htm">Side 2</a>
<a class="mlink" href="side3.htm">Side 3</a>

Denne kode virker upåklageligt i MSIE, Mozilla, Firefox og Opera 7.x. Desværre skal den udbygges en smule for også at virke i Opera før version 7.x:

<a class="mlink" style="display:block;padding:3px;" href="side1.htm">Side 1</a>
<a class="mlink" style="display:block;padding:3px;" href="side2.htm">Side 2</a>
<a class="mlink" style="display:block;padding:3px;" href="side3.htm">Side 3</a>

Du kan se metoden demonstreret i alle menuerne i Hjemmesideskolen.

^ Tilbage til sidens top

---

Andre display-muligheder

inherit

Visningen nedarves fra nærmeste overordnede element.

none

Elementet vises ikke. Siden vises som om elementet slet ikke stod i kildekoden.

inline

Elementet vises som et inline-element, uagtet det pr. default definition måtte være et blok-element.

inline-block

Elementet vises som et blok-element, men opfører sig som et inline-element i forhold til omgivelserne.

list-item

Elementet vises som et liste-element.

table

Elementet vises som en tabel.

table-caption

Elementet vises som en tabel-overskrift.

table-header-group / table-footer-group

Elementet vises som en thead eller tfoot.

table-cell

Elementet vises som en tabelcelle

table-row / table-row-group

Elementet vises som en tr eller en gruppe af tr.

table-column / table-column-group

Elementet vises som en col eller sm en colgroup.

^ Tilbage til sidens top

Valid XHTML og CSS / Copyright © Hjemmesideskolen marts 2003

FreeFind