Display-egenskap: Block, Inline och Inline-block
Svep för att visa menyn
HTML-element beter sig olika beroende på om de är block, inline eller inline-block. Dessa displaytyper påverkar layout, avstånd och vilka CSS-egenskaper du kan använda.
Blockelement
- Börjar på en ny rad;
- Upptar hela bredden av sin behållare;
- Stöder width, height, margin, padding och border.
Vanliga exempel: <div>, <p>, <ul>, <li>, <h1>–<h6>.
index.html
index.css
Inline-element
- Förblir på samma rad;
- Tar endast upp det utrymme som krävs för innehållet;
- Kan inte ha bredd eller höjd tillämpad (men kantlinje fungerar).
Vanliga exempel: <a>, <span>, <img>, <input>.
index.html
index.css
Inline-block-element
- Förblir inline, som text;
- Stöder bredd, höjd, marginal, utfyllnad och kantlinje, likt blockelement.
Exempel: <button>, <select>, <textarea>.
De är användbara när du behöver element sida vid sida, men ändå vill ha full kontroll över utseendet.
index.html
index.css
Viktiga skillnader
Var allt tydligt?
Tack för dina kommentarer!
Avsnitt 3. Kapitel 4
Fråga AI
Fråga AI
Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal
Avsnitt 3. Kapitel 4
