على سبيل المثال ، مع "مساحة إضافية" ، لدينا الكود التالي في HTML الخاص بنا.
مساحة إضافية
ملاحظة: إذا كنت تستخدم محرر WYSIWYG لإدخال الرمز أعلاه ، فيجب أن تكون في علامة تبويب HTML أو تقوم بتحرير كود HTML.
- قائمة كاملة من أحرف HTML الموسعة الخاصة.
الحفاظ على التباعد في النص الذي تم لصقه في صفحة
إذا كنت تلصق النص بمسافات أو علامات تبويب إضافية ، فيمكنك استخدام HTML
علامة للحفاظ على تنسيق النص. فيما يلي مثال عن كيفية لصق النص بمسافات إضافية باستخدامالعلامة.يحتوي هذا النص على الكثير من المساحاتالمثال أعلاه يتم باستخدام كود HTML أدناه.
يحتوي هذا النص على الكثير من المساحاتملاحظة: إذا كنت تستخدم محرر WYSIWYG لإدخال الرمز أعلاه ، فيجب أن تكون في علامة تبويب HTML أو تقوم بتحرير كود HTML.
- انظر HTML لدينا
صفحة العلامات لمزيد من المعلومات حول هذه العلامة.
إنشاء مساحة إضافية حول عنصر أو كائن
يمكن لأي عنصر HTML إضافة تباعد إضافي يضاف إلى الأعلى أو اليمين أو الأسفل أو اليسار. ومع ذلك ، من المهم أن تفهم الفرق بين الهامش والحشو قبل تحديد نوع المساحة التي تريد إضافتها حول العنصر أو كائن آخر. كما ترون في الصورة أدناه ، فإن الحشو هو ما يحيط بالعنصر مباشرة ، داخل الحدود ، والهامش خارج الحدود.
في المثال أدناه ، لدينا فقرة محاطة بحدود ، بادئة مع هامش ، ولها مساحة على يمين وأسفل الفقرة.
مثال على فقرة مع الهامش والحشو.
تم إنشاء المثال أعلاه باستخدام الرمز أدناه.
مثال على فقرة مع الهامش والحشو.
في القسم الأول من الكود ، "الهامش الأيسر: 2.5em ؛" يضيف الهامش الأيسر من 2.5 م ، والذي يعطي مظهر النص البادئة. كما هو موضح في المثال ، هذا التباعد خارج الحدود. في القسم التالي ، "الحشو: 0 7em 2em 0 ؛" يقوم بتحديد الحشوة العلوية واليمنى والسفلية واليسرى (في اتجاه عقارب الساعة). يوجد حشوة علوية "0" ، حشوة يمينية "7em" ، حشوة سفلية "2em" ، و 0 حشوة يسرى. ما تبقى من هذا المثال هو تحديد كيف ينبغي أن تبدو الحدود.
إنشاء علامة تبويب باستخدام CSS و HTML
يمكن إنشاء علامة تبويب بتنسيق HTML عن طريق ضبط الهامش الأيسر للعنصر. على سبيل المثال ، تحتوي هذه الفقرة على هامش يساوي 2.5 م من العنصر الذي يحتوي على النص. يتم عرض CSS لإنشاء هذا الهامش الأيسر أدناه.
.tab {margin-left: 2.5em} بعد وضع هذا الرمز في ملف CSS الخاص بنا ، يمكننا تطبيق فئة "علامة التبويب" على أي نص لإنشاء مظهر علامة تبويب. يمكن زيادة أو تقليل قيمة الهامش الأيسر حسب احتياجاتك.
على الرغم من أننا نوصي بالطريقة أعلاه ، يمكن أيضًا إضافة CSS على الهامش في السطر كما هو موضح في المثال أدناه.
مثال على الهامش الأيسر 5em.
مثال على الهامش الأيسر 5em.
- كيف يمكنني المسافة البادئة أو النص في صفحة الويب الخاصة بي أو في HTML؟
إذا كنت بحاجة إلى إضافة مساحة إضافية أسفل سطر أو فقرة من النص ، وتحتاج فقط إلى القيام بذلك مرة واحدة ، يمكنك استخدام
علامة لإضافة مساحة إضافية في وثيقة. فيما يلي مثال على كيفية تطبيق هذه التقنية.
هذه الجملة تحتوي على مثال النص.
كما ترون ، تمت إضافة فواصل اثنين لإنشاء المساحة أعلاه.
الكود أعلاه سينشئ النص الموضح أدناه.
هذه الجملة تحتوي على مثال النص.
كما ترون ، تمت إضافة فواصل اثنين لإنشاء المساحة أعلاه.
يمكن إضافة فواصل إضافية إذا لزم الأمر. ومع ذلك ، نقترح استخدام طريقة CSS المذكورة مسبقًا لإضافة الحشو والتباعد حول النص الخاص بك إذا تم القيام به في أماكن متعددة على الصفحة.