CSS Margin خصائص
المغلق margin يتم استخدام الخصائص لتوليد الفضاء حول العناصر.
على margin خصائص تعيين حجم المساحة البيضاء خارج الحدود.
هذا العنصر لديه margin من 80px.
CSS Margins
المغلق margin خصائص تعيين حجم المساحة البيضاء خارج الحدود.
 | ملاحظة: margins شفافة تماما - ولا يمكن أن يكون لها لون الخلفية! |
|---|
مع CSS، لديك السيطرة الكاملة على margins . هناك خصائص CSS لوضع margin للكل جانب من عنصر (أعلى، يمين، أسفل، واليسار).
Margin - الفردية الجانبين
CSS له خصائص لتحديد margin للكل جانب عنصر:
-
margin-top -
margin-right -
margin-bottom -
margin-left
جميع margin خصائص يمكن أن يكون القيم التالية:
- auto - المتصفح بحساب margin
- طول - يحدد على margin في px, pt, cm ، الخ
- تحدد ل-٪ margin في المائة من عرض عنصر يحتوي على
- وراثة - تنص على أن margin يجب أن تكون موروثة من العنصر الأصلي
| ملاحظة: من الممكن أيضا استخدام القيم السلبية لل margins .إلى تداخل المحتوى. |
|---|
يقوم المثال التالي مختلفة margins لجميع الجوانب الأربعة من <p> العنصر:
مثال
p {
margin-top: 100px;
margin-bottom: 100px;
margin-right: 150px;
margin-left: 80px;
} انها محاولة لنفسك » المثال التالي يتيح اليسار margin تكون موروثة من العنصر الأصلي:
مثال
div.container {
border: 1px solid red;
margin-left: 100px;
}
p.one {
margin-left:
inherit;
} انها محاولة لنفسك » Margin - الخاصية المختصرة
لتقصير رمز، فمن الممكن لتحديد كافة margin العقارات في خاصية واحدة.
على margin الخاصية هي خاصية الاختزال للالفردية التالية margin الخصائص:
-
margin-top -
margin-right -
margin-bottom -
margin-left
لذلك، وهنا هو كيف يعمل:
إذا كان margin الخاصية لديه أربع قيم:
- margin : 25px 50px 75px 100px؛
- الهامش العلوي هو 25px
- الهامش الأيمن هو 50px
- الهامش السفلي هو 75px
- الهامش الأيسر هو 100px
إذا كان margin الخاصية لديه ثلاث قيم:
- margin : 25px 50px 75px؛
- الهامش العلوي هو 25px
- هوامش اليمين واليسار هي 50px
- الهامش السفلي هو 75px
إذا كان margin الملكية لها قيمتين:
- margin : 25px 50px؛
- الهوامش العلوية والسفلية هي 25px
- هوامش اليمين واليسار هي 50px
إذا كان margin الملكية لها قيمة واحدة:
- margin : 25px؛
- كل الهوامش الأربعة هي 25px
استخدام قيمة السيارات
يمكنك تعيين margin الملكية ل auto إلى مركز أفقيا العنصر داخل الحاوية الخاصة به.
والعنصر ثم تناول العرض المحدد، وسيتم تقسيم المساحة المتبقية بالتساوي بين اليسار واليمين margins :
اختبر نفسك مع تمارين!
التمرين 1 » التمرين 2» التمرين 3 » التمرين 4»
جميع خصائص CSS الهامش
| الملكية | وصف |
|---|---|
| margin | خاصية الاختزال لتحديد margin العقارات في إعلان واحد |
| margin-bottom | يحدد القاع margin عنصر |
| margin-left | مجموعات اليسار margin عنصر |
| margin-right | يحدد الصحيح margin عنصر |
| margin-top | تعيين كبار margin عنصر |