كيفية إزالة الخلفية في التخطيط: طرق وتعليمات بسيطة

تعد الخلفية في التخطيط أحد عناصر التصميم المهمة التي تخلق جوا وتنقل الحالة المزاجية للموقع. ومع ذلك ، في بعض الأحيان يكون من الضروري إزالة الخلفية أو استبدالها بأخرى. في هذه المقالة ، سنتحدث عن طرق بسيطة ستساعدك على إزالة الخلفية في التخطيط دون اللجوء إلى البرامج المعقدة والمهارات الخاصة.

الطريقة الأولى هي استخدام خاصية خلفية كس وتعيين القيمة إلى بلا. للقيام بذلك ، يمكنك إنشاء فئة منفصلة أو إضافة خاصية إلى فئة موجودة مسؤولة عن خلفية التخطيط الخاص بك. على سبيل المثال ، إضافة التعليمات البرمجية التالية إلى ملف المغلق:

.تخطيط لا خلفية {

خلفية: لا شيء;

}

بعد ذلك ، يمكنك إضافة فئة التخطيط بدون خلفية إلى العلامة المسؤولة عن التخطيط لإزالة الخلفية. على سبيل المثال:

1. الطريقة الثانية هي استخدام صورة كعب. يمكنك إنشاء صورة بسيطة سيتم استخدامها بدلا من الخلفية. للقيام بذلك ، يمكنك استخدام برامج تحرير الصور Photoshop مثل فوتوشوب أو الأعرج. إنشاء صورة من الحجم المطلوب واللون ، وحفظه في ينغ أو جبيغ الشكل. ثم أضف الكود التالي إلى ملف هتمل الخاص بك:
2. بهذه الطريقة ، يمكنك استبدال خلفية التخطيط الخاص بك بالصورة الفارغة التي قمت بإنشائها. تتيح لك هذه الطريقة إنشاء تصميم فريد ونقل جو خاص إلى موقعك.
3. لماذا من المهم إزالة الخلفية في التخطيط
4. كيفية إزالة الخلفية باستخدام كس
5. باستخدام خاصية الخلفية
6. باستخدام خاصية التعتيم
7. كيفية إزالة الخلفية باستخدام صورة
8. استخدام أدوات إزالة الخلفية
9. سؤال وجواب
10. كيف يمكنني إزالة الخلفية في تخطيط?

كيف يمكنني إزالة الخلفية في تخطيط باستخدام فوتوشوب?

هل من الممكن إزالة الخلفية في التخطيط دون استخدام برامج خاصة?

لماذا من المهم إزالة الخلفية في التخطيط

1. يمكن أن تلعب الخلفية في التخطيط دورا مهما في إنشاء انطباع عام عن صفحة ويب أو تطبيق. غالبا ما تكون صورة الخلفية أو اللون أحد عناصر التصميم الرئيسية التي يمكن أن تعزز الإدراك الجمالي للمستخدم.

   ومع ذلك ، في بعض الأحيان قد يكون من المهم أيضا إزالة الخلفية في التخطيط. فيما يلي بعض الأسباب:

2. زيادة سرعة التنزيل

   كلما قل عدد العناصر التي يحتاج المتصفح إلى تحميلها وعرضها ، زادت سرعة تحميل الصفحة أو التطبيق. عن طريق إزالة الخلفية ، ستقلل من عدد الصور أو أنظمة الألوان التي يجب تحميلها ، مما يقلل بشكل كبير من وقت التنزيل.

3. تحسين قابلية قراءة المحتوى

   في بعض الأحيان قد تتداخل صورة أو لون الخلفية مع قراءة النص أو إدراك العناصر الأخرى على الصفحة أو التطبيق. عن طريق إزالة الخلفية ، ستجعل المحتوى أكثر قابلية للقراءة وسهل الاستخدام.

زيادة مرونة التصميم

من خلال تغيير صورة الخلفية أو اللون في التخطيط ، يمكنك بسهولة تغيير مظهر الصفحة أو التطبيق حسب احتياجاتك. عن طريق إزالة الخلفية ، يمكنك فتح المزيد من الاحتمالات للتصميم والتكيف مع الأجهزة أو المواقف المختلفة.

بشكل عام ، يمكن أن يكون تنظيف الخلفية في التخطيط مفيدا في مواقف مختلفة ، ويجب اتخاذ هذا القرار اعتمادا على المتطلبات المحددة للمشروع وأهدافه.

كيفية إزالة الخلفية باستخدام كس

إزالة الخلفية باستخدام كس هي واحدة من أسهل الطرق لتغيير مظهر عنصر على صفحة ويب. للقيام بذلك ، يكفي استخدام العديد من خصائص كس.

الخطوة الأولى هي تحديد العنصر الذي تريد إزالة الخلفية منه. يمكنك استخدام محددات كس مثل الفئات أو المعرفات أو العلامات للقيام بذلك. على سبيل المثال ، إذا كنت بحاجة إلى إزالة خلفية عنصر مع فئة "المحتوى" ، فسيبدو المحدد كما يلي:

.المحتوى {

خلفية: لا شيء;

}

تحدد خاصية" الخلفية " خلفية العنصر. تشير القيمة" بلا " إلى عدم وجود خلفية. ضع هذا الرمز داخل العلامة في قسم مستند هتمل.

إذا كنت بحاجة إلى إزالة الخلفية من جميع العناصر الموجودة على الصفحة ، يكفي تطبيق رمز كس هذا على العلامة :

الجسم {

خلفية: لا شيء;

}

بالإضافة إلى تعيين القيمة على "بلا" ، يمكنك أيضا استخدام خصائص أخرى لإزالة الخلفية. على سبيل المثال ، يمكن تعيين خاصية" لون الخلفية "على" شفاف " لجعل الخلفية شفافة.:

.المحتوى {

لون الخلفية: شفاف;

}

يمكنك أيضا تعيين صورة خلفية أو تدرج باستخدام خصائص" صورة الخلفية "و" تدرج الخلفية".

بشكل عام ، باستخدام كس ، يمكنك تحقيق تأثيرات مختلفة وتغييرات المظهر. ومن الجدير تجريب واختيار الخيار الأنسب لمشروعك.

باستخدام خاصية الخلفية

1. لتعيين الخلفية على العناصر في التخطيط ، يمكنك استخدام خاصية الخلفية. تتيح لك هذه الخاصية تعيين لون أو صورة كخلفية لعنصر ما.
2. تحتوي خاصية الخلفية على العديد من المعلمات التي يمكن استخدامها:
3. لون الخلفية: يحدد لون خلفية العنصر;
4. صورة الخلفية: تحدد الصورة المراد استخدامها كخلفية;
5. الخلفية-كرر: يحدد كيفية تكرار صورة الخلفية;
6. الخلفية-الموضع: يسمح لك بتعيين موضع بداية صورة الخلفية;

حجم الخلفية: يحدد حجم صورة الخلفية;

مرفق الخلفية: يحدد كيفية "إرفاق" صورة الخلفية عند التمرير في الصفحة.

على سبيل المثال ، لتعيين لون الخلفية لعنصر ما ، يمكنك استخدام رمز كس التالي:

.العنصر {

لون الخلفية: # إف 2 إف 2 إف 2;

}

إذا كنت تريد استخدام صورة كخلفية ، فحدد مسارها في الخلفية-صورة: خاصية

.العنصر {

الخلفية-صورة: رابط ('مسار / إلى / صورة.جي بي جي);

}

يمكنك أيضا التحكم في تكرار صورة الخلفية باستخدام الخلفية-كرر:

.خاصية العنصر {

الخلفية-كرر: لا-كرر;

}

بشكل افتراضي ، يتم تكرار صورة الخلفية أفقيا وعموديا. إذا كنت بحاجة إلى تغيير هذا السلوك ، فيمكنك استخدام الخلفية-كرر:

.عنصر المعلمة{

الخلفية-كرر: كرر-س ؛ / * كرر أفقيا فقط */

الخلفية-كرر: كرر ذ؛ / * كرر عموديا فقط */

الخلفية-كرر: لا-كرر; / * لا تتكرر صورة الخلفية */

}

لتعيين موضع بداية صورة الخلفية ، يمكنك استخدام خاصية موضع الخلفية. يمكن أن تأخذ القيم التي تحدد الإزاحة الأفقية والرأسية بالنسبة للعنصر:

.العنصر {

الخلفية-الموضع: أعلى اليسار ؛ / * تبدأ صورة الخلفية في أعلى اليسار */

الخلفية-الوظيفة: مركز المركز; / * توجد صورة الخلفية في المركز */

الخلفية-الموضع: أسفل اليمين ؛ / * تبدأ صورة الخلفية في أسفل اليمين */

}

يمكن تعيين حجم صورة الخلفية باستخدام خاصية حجم الخلفية:

.العنصر {

حجم الخلفية: الغلاف ؛ / * تمتد صورة الخلفية على العنصر بأكمله */

حجم الخلفية: يحتوي ؛ / * يتم وضع صورة الخلفية في العنصر دون تشويه */

حجم الخلفية: 50 ٪ تلقائي ؛ / * تشغل صورة الخلفية 50٪ من عرض العنصر ، ويتم ضبط الارتفاع تلقائيا */

}

أخيرا ، تتيح لك خاصية إرفاق الخلفية تحديد كيفية "إرفاق" صورة الخلفية عند التمرير في الصفحة:

.العنصر {

الخلفية-مرفق: التمرير؛ / * مخطوطات صورة الخلفية جنبا إلى جنب مع المحتوى */

مرفق الخلفية: ثابت; / * تظل صورة الخلفية ثابتة عند التمرير في الصفحة */

}

وبالتالي ، باستخدام خاصية الخلفية ، يمكنك بسهولة ومرونة ضبط خلفية العناصر في التخطيط وإنشاء تصميم مثير للاهتمام.

باستخدام خاصية التعتيم

تسمح لك خاصية التعتيم بالتحكم في شفافية العنصر. يمكن أن تتراوح قيمة الخاصية من 0 إلى 1 ، حيث يشير 0 إلى الشفافية الكاملة ويشير 1 إلى التعتيم الكامل. في هذه الحالة ، يتم تطبيق الشفافية ليس فقط على خلفية العنصر ، ولكن أيضا على جميع أحفاده.

لتغيير شفافية خلفية التخطيط باستخدام خاصية التعتيم ، يجب تعيين القيمة المناسبة لهذا العنصر. على سبيل المثال:

مثال على تخطيط مع خلفية شفافة

النص

1

العنصر معتم تماما

من المهم ملاحظة أن خاصية التعتيم تؤثر أيضا على شفافية المحتوى الكامل للعنصر وأحفاده. على سبيل المثال ، إذا قمت بتعيين الخاصية لعنصر بخلفية شفافة

التعتيم: 0.5;

ثم يصبح النص والعناصر الأخرى الموجودة داخل هذا العنصر شفافة أيضا. إذا كنت بحاجة إلى جعل خلفية التخطيط شفافة فقط ، يمكنك استخدام خاصية لون الخلفية مع الإشارة إلى شفافية الخلفية بتنسيق رغبا:

مثال على تخطيط مع خلفية شفافة

• النص
• استخدام كس: تعيين الصورة كخلفية للعنصر باستخدام خاصية كس
• صورة الخلفية

. من الممكن أيضا استخدام خصائص أخرى مثل

الخلفية-كرر

و

حجم الخلفية

• لضبط عرض الخلفية.
• باستخدام برنامج خاص: باستخدام برامج خاصة مثل برامج تحرير الرسومات ، يمكنك تغيير خلفية الصورة إلى لون شفاف أو إلى لون مختلف.
• اختر الطريقة الأكثر ملاءمة ومناسبة لك لإزالة خلفية الصورة وإنشاء التأثير المطلوب في التخطيط الخاص بك.

ملاحظة: عند استخدام الصور مع خلفية شفافة ، والانتباه إلى تنسيق الملف — ينغ أو جيف هو الأكثر استخداما.

استخدام أدوات إزالة الخلفية

هناك العديد من الأدوات عبر الإنترنت التي تتيح لك إزالة الخلفيات من الصور بسرعة وسهولة. وهنا بعض منهم:

خدمات إزالة الخلفية: تستخدم هذه الخدمات الخوارزميات والتعلم الآلي لإزالة الخلفية تلقائيا. ما عليك سوى تحميل صورة ، وتقوم الخدمة بمعالجتها ، وإزالة الخلفية وترك الكائنات الضرورية فقط. بعض الخدمات الشعبية تشمل Remove.bg ، لقطة السحر وكانفا.

محرري الصور مع أدوات إزالة الخلفية: بعض المحررين الصورة Adobe مثل أدوبي فوتوشوب والأعرج ، وتقديم أدوات لإزالة الخلفية. إنها تسمح لك بتمييز الخلفية وإزالتها يدويا عن طريق الرسم أو استخدام أداة لاسو. تتطلب هذه الأدوات بعض المهارات للعمل مع برامج تحرير الصور ، ولكنها توفر مزيدا من التحكم في العملية.

المكونات الإضافية للمتصفح: توفر بعض المكونات الإضافية للمتصفح ، مثل ممحاة الخلفية أو إلغاء الشاشة ، إزالة سريعة ومريحة للخلفية في المتصفح مباشرة. غالبا ما تستخدم هذه المكونات الإضافية خوارزميات التعلم الآلي لتمييز الخلفية وإزالتها تلقائيا.

عند استخدام أي أداة لإزالة الخلفية ، من المهم أن يكون لديك صورة عالية الجودة مع كائنات وخلفيات مميزة بألوان زاهية تختلف في اللون. كن حذرا أيضا عند إزالة الخلفية للحفاظ على طبيعة وتفاصيل الكائنات في الصورة.

سؤال وجواب