logó WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS
Ingyenes elektronikus tananyag interaktív weboldalak készítéséhez.
menüMENÜ   

Doboz modell





margin = külső margó

border = szegély

padding = belső margó

width = tartalom szélessége

height = tartalom magassága

Az elem teljes szélessége = bal külső margó + bal szegély + bal belső margó + tartalom szélessége + jobb belső margó + jobb szegély + jobb külső margó

Az elem teljes magassága = felső külső margó + felső szegély + felső belső margó + tartalom magassága + alsó belső margó + alsó szegély + alsó külső margó


Példa:

Forráskód



<style>
div_1 { 
  width: 200px; height: 200px; 
  padding: 30px; margin:7px;
  border:5px solid gray; background-color:yellow;  
} 
</style>
...  
<body>            
   <div class="div_1">
       Tartalom
   </div>
</body>
 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_doboz_1.html

Ahogy a legtöbb honlap, ez a webhely is használ sütiket a weboldalain.