.ﺪﻧﻮﺷ ﯽﻣ ﻊﻤﺟ ﻪﯿﺷﺎﺣ ﮏﯾ ﺭﺩ ﻪﯿﺷﺎﺣ ﻭﺩ ﺕﺎﻗﻭﺍ ﯽﻫﺎﮔ
ﺪﻧﻮﺷ ﯽﻣ ﻊﻤﺟ ﺪﺣﺍﻭ ﮏﯾ ﺕﺭﻮﺻ ﻪﺑ ﺕﺎﻗﻭﺍ ﯽﻫﺎﮔ ﺮﺻﺎﻨﻋ ﻦﯿﯾﺎﭘ ﻭ ﻻﺎﺑ ﯼﺎﻫ ﻪﯿﺷﺎﺣ
!ﻦﯿﯾﺎﭘ ﻭ ﻻﺎﺑ ﯼﺎﻫ ﻪﯿﺷﺎﺣ ﻂﻘﻓ !ﺪﺘﻓﺍ ﯽﻤﻧ ﻕﺎﻔﺗﺍ ﻦﯾﺍ ﺖﺳﺍﺭ ﻭ ﭗﭼ ﻪﯿﺷﺎﺣ ﺭﺩ
:ﺪﯿﻨﮐ ﻩﺎﮕﻧ ﺮﯾﺯ ﻝﺎﺜﻣ ﻪﺑ
:ﻪﯿﺷﺎﺣ ﯽﺷﺎﭘﻭﺮﻓ ﺶﯾﺎﻤﻧ
h1 {
margin: 0 0 50px 0;
}
h2 {
margin: 20px 0 0 0;
}
→ ﺪﯿﻨﮐ ﻥﺎﺤﺘﻣﺍ ﺍﺭ ﻥﺁ ﻥﺎﺗﺩﻮﺧ
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
margin: 0 0 50px 0;
}
h2 {
margin: 20px 0 0 0;
}
</style>
</head>
<body>
<p>In this example the h1 element has a bottom margin of 50px and the h2 element has a top margin of 20px. So, the vertical margin between h1 and h2 should have been 70px (50px + 20px). However, due to margin collapse, the actual margin ends up being 50px.</p>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
</body>
</html>
ﻭ ﻞﺴﮑﯿﭘ 50 ﻦﯿﯾﺎﭘ ﻪﯿﺷﺎﺣ ﯼﺍﺭﺍﺩ <h1> ﺮﺼﻨﻋ ،ﻻﺎﺑ ﻝﺎﺜﻣ ﺭﺩ
ﺖﺳﺍ <h1> ﻦﯿﺑ ﯼﺩﻮﻤﻋ ﻪﯿﺷﺎﺣ ﺯﺍ ﯽﮐﺎﺣ ﻢﯿﻠﺳ ﻞﻘﻋ ﺪﺳﺭ ﯽﻣ ﺮﻈﻧ ﻪﺑ
ﻥﻼﻋﺍ ﮏﯾ ﺭﺩ ﻪﯿﺷﺎﺣ ﯼﺎﻫ ﯽﮔﮋﯾﻭ ﻡﺎﻤﺗ ﻢﯿﻈﻨﺗ ﯼﺍﺮﺑ ﺮﺼﺘﺨﻣ ﯽﮔﮋﯾﻭ ﮏﯾ
ﺪﻨﮐ ﯽﻣ ﻢﯿﻈﻨﺗ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ ﻦﯿﯾﺎﭘ ﻪﯿﺷﺎﺣ
ﺪﻨﮐ ﯽﻣ ﻢﯿﻈﻨﺗ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ ﭗﭼ ﺖﻤﺳ ﻪﯿﺷﺎﺣ
ﺪﻨﮐ ﯽﻣ ﻢﯿﻈﻨﺗ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ ﺖﺳﺍﺭ ﺖﻤﺳ ﻪﯿﺷﺎﺣ
ﺪﻨﮐ ﯽﻣ ﻢﯿﻈﻨﺗ ﺍﺭ ﺮﺼﻨﻋ ﮏﯾ ﯽﯾﻻﺎﺑ ﻪﯿﺷﺎﺣ