الخلفية هي أحد أهم عناصر موقع الويب. تخلق الخلفية الجيدة نغمة موقع الويب وتكمل المحتوى. هناك العديد من الطرق المختلفة لإضافة خلفية ، ولكل طريقة غرض مختلف. تسمح لك بعض الطرق بتطبيق الخلفية على جميع الصفحات في موقع الويب ، بينما يقصر البعض الآخر الخلفية على صفحة معينة فقط. تعلمك هذه المقالة كيفية إضافة خلفية إلى موقع الويب الخاص بك باستخدام HTML أو CSS.
خطوات
طريقة 1 من 2: طرق HTML
خلفية ملونة صلبة
الخطوة الأولى: الخلفية الملونة الصلبة هي النوع الأساسي للخلفية التي يمكنك وضعها على موقع ويب
في الواقع ، يبدأ كل موقع بخلفية بيضاء افتراضية. ومع ذلك ، في حين أن الخلفية البيضاء يمكن أن تكون أنيقة للغاية ونظيفة المظهر عند استخدامها مع نظام ألوان متناغم ، فقد يتم تفضيل خلفية ملونة مختلفة بموضوعات مختلفة.
الخطوة 2. افتح كود الويب الخاص بك (المصدر)
الخطوة 3. في علامة النص الأساسي ، أضف سمة تسمى bgcolor
الآن ، يجب أن تبدو علامة الجسد هكذا-
حيث COLORNAME هو اسم اللون. يمكن ملء COLORNAME بالعديد من أنواع ممثلي الألوان-
- (اسم اللون)
- (قيمة سداسية عشرية)
- (قيمة RGB)
الخطوة 4. تجربة استخدام RGB و # يمكن أن يؤدي إلى العديد من الظلال ، ولكن يمكنك اتباع الطريقة الأولى السهلة
لكن تذكر أن كتابة لون غير شائع مثل "Ultramarine Blueish Green" سيؤدي إلى اللون الأبيض.
إضافة صورة خلفية
تعد إضافة صورة خلفية أكثر تعقيدًا قليلاً من خلفية ملونة صلبة
الخطوة 1. أضف خاصية الخلفية إلى علامة الجسم ، بحيث تبدو كالتالي-
حيث SRC هو مصدر الصورة يمكن أن يكون SRC في نفس المجلد ، أو مجلد / صفحة ويب أخرى.
- (في نفس المجلد)
- (داخل مجلد مختلف)
- (في صفحة ويب مختلفة)
الخطوة 2. تذكر كتابة الامتداد.gif /-j.webp" />
الطريقة 2 من 2: أساليب CSS
خلفية ملونة صلبة
الخطوة الأولى. لإضافة خلفية ملونة صلبة في CSS ، أضف سمة نمط
يمكنك أيضًا إعطاء المعرفات والفئات واستخدام أوراق الأنماط الخارجية والداخلية.
الخطوة 2. يجب أن تبدو علامة جسمك هكذا-
حيث يكون COLORNAME هو اسم اللون أو القيمة السداسية أو RGB (تذكر أيضًا الخطوات الأخيرة للخلفية الملونة الصلبة في HTML ، فهي قابلة للتطبيق هنا أيضًا).
إضافة صورة
الخطوة 1. لإضافة صورة ، أضف سمة النمط إلى علامة النص الأساسي
يمكنك أيضًا إعطاء المعرفات والفئات واستخدام أوراق الأنماط الخارجية والداخلية.
الخطوة 2. يجب أن تبدو علامة جسمك الآن على هذا النحو-
الخطوة 3. تذكر أن SRC هو المصدر
يمكن أن يكون من نفس المجلد أو مجلد مختلف أو صفحة ويب مختلفة.
- (في نفس المجلد)
- (داخل مجلد مختلف)
- (في صفحة ويب مختلفة).
الخطوة 4. تذكر أن تضيف الامتدادات
تكرار الخلفية المنقوشة
الخطوة 1. لعمل خلفية نمط متكررة ، أضف خلفية كما قيل في الخطوات أعلاه
يجب الآن تغيير علامة جسمك إلى-
حيث تكون REPEAT-SETTINGS هي الإعدادات. يمكن أن يكون هناك العديد من إعدادات التكرار ، مثل-
- (ستتكرر الخلفية رأسيًا وأفقيًا.)
- (ستتكرر الخلفية أفقيًا.)
- (ستتكرر الخلفية عموديًا.)
خلفية الصورة الثابتة
الخطوة 1. تبدو خلفيات الصور الثابتة رائعة ولا تتغير أثناء التمرير لأسفل
للقيام بها ، ما عليك سوى إجراء بعض التعديلات البسيطة على الكود في القسم أعلاه. قم بإجراء التعديلات لجعل علامة الجسم تبدو هكذا-