في أغلب الأحيان ، لتحديد حجم المسافات البادئة في صفحات HTML ، يتم استخدام إمكانيات لغة CSS (أوراق الأنماط المتتالية). على الرغم من وجود العديد من البقايا "البدائية" في لغة HTML نفسها ، مما يسمح في بعض الحالات بتعيين المسافة البادئة. فيما يلي الخيارات التي يتم استخدامها في أغلب الأحيان ، ولكن بجانبها لا يزال هناك الكثير من أنواع الحيل المختلفة التي تسمح لك بتعيين المسافات البادئة للترميز غير القياسي لمستندات HTML.
انه ضروري
معرفة أساسية بلغات HTML و CSS
تعليمات
الخطوة 1
حدد عنصر الصفحة الذي تريد المسافة البادئة منه. على سبيل المثال ، إذا تم وضع النص داخل العلامة … (block) ، فستكون هذه الكتلة هي العنصر الأصل لهذا النص ويجب حساب المسافة البادئة من حدود الكتلة. وإذا لم يكن النص (أو الصورة) داخل أي كتلة (div ، li ، إلخ) أو عناصر مضمنة (امتداد ، p ، إلخ) ، فسيكون الأصل هو نص المستند (علامة النص الأساسي). يعد تحديد العنصر الأصل للنص ضروريًا لأنه هو الذي يحتاج إلى تعيين أوصاف الأنماط التي تشكل المسافات البادئة. لنفترض أنه تم وضع النص الخاص بك داخل كتلة div: نموذج نص
الخطوة 2
استخدم خاصية هامش لغة CSS لتعيين الهوامش ، أي المسافة من حدود العنصر إلى العناصر المجاورة ، وكذلك إلى حدود العنصر الأصل. يمكن تعيين هذه المسافة بشكل منفصل للحشو على كل جانب: الهامش العلوي - في الأعلى ، الهامش الأيمن - على اليمين ، الهامش السفلي - في الأسفل ، الهامش الأيسر - على اليسار. بالنسبة للمثال أعلاه ، قد يبدو رمز css هذا على النحو التالي: div {
أعلى الهامش: 10 بكسل ؛
الهامش الأيمن: 15 بكسل ؛
الهامش السفلي: 40 بكسل ؛
الهامش الأيسر: 70 بكسل ؛
} هنا "div" محدد يحدد أن هذا النمط يجب أن يتم تطبيقه على جميع divs في كود المستند. تسمح لك بنية CSS بدمج جميع الأسطر الأربعة في سطر واحد: div {
الهامش: 10 بكسل 15 بكسل 40 بكسل 70 بكسل ؛
} يجب دائمًا تحديد قيم المسافات البادئة بهذا الترتيب: أولاً - في الأعلى ، ثم - على اليمين ، والأسفل ، واليسار. إذا كانت المسافات البادئة متساوية في جميع الجوانب ، فيكفي تحديد القيمة مرة واحدة: div {
الهامش: 70 بكسل ؛
} بالإضافة إلى ذلك ، يمكنك تعيين هامش أفقي عائم (أي يسار ويمين). يمكن أن يكون هذا مفيدًا جدًا عندما تحتاج إلى تعيين كتلة بعرض معين في منتصف نافذة المتصفح تمامًا. يحدد المتصفح نفسه تلقائيًا مقدار المسافة البادئة التي يجب أن تكون على كلا الجانبين ، إذا كتبت عبارة CSS التالية: div {
الهامش: 0 تلقائي ؛
}
الخطوه 3
استخدم خاصية padding لتعيين المساحة المتروكة ، وهي المسافة من حد العنصر إلى أي عناصر موضوعة بداخله ، بما في ذلك النص. صيغة هذه الخاصية هي نفسها تمامًا لخاصية الهامش: div {
أعلى الحشو: 10 بكسل ؛
المساحة المتروكة لليمين: 15 بكسل ؛
الحشو السفلي: 40 بكسل ؛
المساحة المتروكة: 70 بكسل ؛
} أو div {
الحشو: 10 بكسل 15 بكسل 40 بكسل 70 بكسل ؛
}
الخطوة 4
استخدم خاصية المسافة البادئة للنص لتعيين المسافة البادئة الإضافية للسطر الأول من كل فقرة من النص. على سبيل المثال: div {
مسافة بادئة نصية: 80 بكسل ؛
}
الخطوة الخامسة
استخدم سمات hspace و vspace لعلامة HTML img لتعيين المسافة البادئة الأفقية والعمودية من الصورة إلى العناصر الخارجية ، على التوالي. على سبيل المثال ، مثل هذا:
الخطوة 6
استخدم سمة cellpadding لعلامة الجدول إذا كنت بحاجة إلى تعيين المسافة البادئة من حدود الخلايا في الجدول إلى محتواها. وتحدد سمة تباعد الخلايا التباعد بين خلايا الجدول. على سبيل المثال:
| 1 | 2 |
