---
url: 'https://dxpr.com/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%A7%D9%84%D8%AE%D9%84%D9%81%D9%8A%D8%A7%D8%AA'
title: 'منح مقطع لونًا أو صورة أو تدرجًا | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T01:23:42+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  يمكنكم ملء أي مقطع بلون أو صورة أو تدرج لوني. ويأتي اللون والصورة من لوحة
  النمط التي تحملها المقاطع والصفوف والأعمدة والعناصر كلها. وتضيف المقاطع
  لوحة مؤثرات الخلفية للتدرجات والصور الثابتة والتزييح البصري وفيديو
  YouTube. يبني المثال مقطعًا كحليًا مع صورة مدينة ونص أبيض وتدرج فوقه.
  يضيف الفيديو صورة خلف مقطع، ثم يغطيها بتدرج لوني.
tags:
  - 'Design guides'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'منح مقطع لونًا أو صورة أو تدرجًا'
      description: |-
        يمكنكم ملء أي مقطع بلون أو صورة أو تدرج لوني. ويأتي اللون والصورة من لوحة
        النمط التي تحملها المقاطع والصفوف والأعمدة والعناصر كلها. وتضيف المقاطع
        لوحة مؤثرات الخلفية للتدرجات والصور الثابتة والتزييح البصري وفيديو
        YouTube. يبني المثال مقطعًا كحليًا مع صورة مدينة ونص أبيض وتدرج فوقه.
        يضيف الفيديو صورة خلف مقطع، ثم يغطيها بتدرج لوني.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T01:23:42+0000'
      dateModified: '2026-10-24T17:19:22+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%A7%D9%84%D8%AE%D9%84%D9%81%D9%8A%D8%A7%D8%AA'
      articleSection: 'أدلة التصميم'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%A7%D9%84%D8%AE%D9%84%D9%81%D9%8A%D8%A7%D8%AA'
      description: |-
        يمكنكم ملء أي مقطع بلون أو صورة أو تدرج لوني. ويأتي اللون والصورة من لوحة
        النمط التي تحملها المقاطع والصفوف والأعمدة والعناصر كلها. وتضيف المقاطع
        لوحة مؤثرات الخلفية للتدرجات والصور الثابتة والتزييح البصري وفيديو
        YouTube. يبني المثال مقطعًا كحليًا مع صورة مدينة ونص أبيض وتدرج فوقه.
        يضيف الفيديو صورة خلف مقطع، ثم يغطيها بتدرج لوني.
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: الرئيسية
            item: 'https://dxpr.com/ar'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: ar
---
[مركز المساعدة](/ar/hc)/[التوثيق](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82) /[تعلّم DXPR Builder](/ar/hc/documentation/learn-dxpr-builder) /[بناء الصفحات](/ar/hc/documentation/learn-dxpr-builder/build) /[تنسيق العناصر](/ar/hc/documentation/learn-dxpr-builder/element-settings) /[أدلة التصميم](/ar/hc/documentation/learn-dxpr-builder/design/overview) # منح مقطع لونًا أو صورة أو تدرجًا.

 تعلّم DXPR Builderبناء الصفحاتتنسيق العناصرأدلة التصميم

   ## في هذا الدليل

 أدلة ذات صلة

- [تشغيل مقطع بعرض الشاشة الكامل](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%A8%D8%B9%D8%B1%D8%B6-%D8%A7%D9%84%D8%B4%D8%A7%D8%B4%D8%A9-%D8%A7%D9%84%D9%83%D8%A7%D9%85%D9%84)
- [تحريك العناصر عند التمرير أو التحويم أو النقر](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%AA%D8%A8%D9%88%D9%8A%D8%A8-%D8%A7%D9%84%D8%AA%D8%AD%D8%B1%D9%8A%D9%83)
- [صمّموا قسم بطل](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%B4%D8%B1%D9%88%D8%AD%D8%A7%D8%AA/%D9%82%D8%B3%D9%85-%D8%A7%D9%84%D8%A8%D8%B7%D9%84)

يمكنكم ملء أي مقطع بلون أو صورة أو تدرج لوني. ويأتي اللون والصورة من لوحة **النمط** التي تحملها المقاطع والصفوف والأعمدة والعناصر كلها. وتضيف المقاطع لوحة **مؤثرات الخلفية** للتدرجات والصور الثابتة والتزييح البصري وفيديو YouTube. يبني المثال مقطعًا كحليًا مع صورة مدينة ونص أبيض وتدرج فوقه.

يضيف الفيديو صورة خلف مقطع، ثم يغطيها بتدرج لوني.

  ## إضافة لون وصورة

1. انقروا **إضافة عناصر** في منطقة المحتوى الفارغة واختاروا **مقطعًا** من تبويب **التخطيط**.
2. حوّموا فوق المقطع وافتحوا **المزيد > الإعدادات**.
3. افتحوا لوحة **النمط**.
4. اختاروا عيّنة كحلية داكنة لـ **الخلفية**.
5. اختاروا الأبيض لـ **لون الخط**.
6. ضمن **صورة الخلفية**، انقروا **اختيار صورة**. ابحثوا في مكتبة الوسائط وحدّدوا صورة وانقروا **إدراج المحدد**.
7. اضبطوا **نمط الخلفية** على **تغطية**.
8. اضبطوا **موضع الخلفية** على **وسط وسط** وانقروا **حفظ**.
9. انقروا **+** على المقطع واختاروا **نصًا** من تبويب **المحتوى**.
10. اكتبوا عنوانًا، مثل `Evening lectures`، وسطرًا تحته. واضبطوا العنوان على **العنوان 2** ووسّطوا السطرين في شريط أدوات المحرّر.
11. افتحوا لوحة **النمط** واضبطوا **لون الخط** على الأبيض وانقروا **حفظ**.

## إضافة تدرج لوني

1. حوّموا فوق المقطع وافتحوا **المزيد > الإعدادات** مجددًا.
2. افتحوا لوحة **مؤثرات الخلفية** واضبطوا **مؤثر الخلفية** على **تدرج لوني**.
3. اختاروا **لون البداية** و**لون النهاية**، ثم انقروا **حفظ**.
4. انقروا **حفظ** على شريط الأدوات وافتحوا قائمة العرض (أيقونة العين) واختاروا **معاينة**.

## ما الذي ترونه

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

يمزج التدرج من لون البداية في الأعلى إلى لون النهاية في الأسفل. وهو يجلس فوق الصورة. فالألوان المعتمة تغطي الصورة تمامًا؛ والألوان ذات الشفافية تتيح ظهورها.

## الإعدادات

### لوحة النمط (كل مقطع وصف وعمود وعنصر)

| الإعداد | ما يفعله | الافتراضي |
|---|---|---|
| **الخلفية** | لون تعبئة من منتقي الألوان أو عيّنة قالب | لا شيء |
| **صورة الخلفية** | صورة من مكتبة الوسائط، تُختار باستخدام **اختيار صورة** | لا شيء |
| **نمط الخلفية** | **تغطية** تملأ العنصر وتقص؛ و**احتواء** يعرض الصورة كلها وقد يترك فجوات؛ و**دون تكرار** يعرضها مرة بحجمها الخاص؛ و**تكرار** يبلّطها | **افتراضيات القالب** |
| **موضع الخلفية** | أي جزء من الصورة يبقى في العرض عندما تُقص، مثل **وسط وسط** أو **يسار أعلى** | **افتراضيات القالب** |

عند إعداد توليد صور الذكاء الاصطناعي، تقبل **صورة الخلفية** أيضًا أمرًا. انظر [توليد صور الذكاء الاصطناعي](/ar/hc/documentation/learn-dxpr-builder/ai/image-generation).

### لوحة مؤثرات الخلفية (المقاطع فقط)

| مؤثر الخلفية | ما يفعله | إعدادات إضافية |
|---|---|---|
| **صورة بسيطة** (افتراضي) | تُمرَّر الصورة مع الصفحة | لا شيء |
| **صورة ثابتة** | تبقى الصورة مكانها بينما تُمرَّر الصفحة فوقها | لا شيء |
| **صورة تزييح** | تتحرك الصورة أبطأ من الصفحة. انظر [المقطع البطولي](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%B4%D8%B1%D9%88%D8%AD%D8%A7%D8%AA/%D9%82%D8%B3%D9%85-%D8%A7%D9%84%D8%A8%D8%B7%D9%84) لمثال. | **سرعة التزييح** و**وضع التزييح** (**ثابت** أو **محلي**) و**تعطيل على الجوال** |
| **تدرج لوني** | يمزج لونين عبر المقطع، فوق الصورة عند وجودها | **لون البداية** و**لون النهاية** و**اتجاه التدرج** (180 درجة تسير من الأعلى إلى الأسفل) و**موضع البداية** و**موضع النهاية** |
| **فيديو YouTube** | يملأ المقطع فيديو YouTube صامت؛ حدّدوا **تكرار** لإعادته | **رابط فيديو YouTube** و**خيارات الفيديو** و**وقت البدء بالثواني** و**وقت التوقف بالثواني** |

تحرّك مؤثرات الثبات والتزييح الصورة التي ضبطتموها في لوحة **النمط**. ولا يحتاج فيديو YouTube صورة.

## إذا لم تروا الخلفية

- **لا توجد لوحة مؤثرات خلفية.** المقاطع وحدها تحملها. حوّموا فوق المقطع، لا صف أو عمود أو عنصر، وافتحوا **المزيد > الإعدادات**.
- **الصورة مقصوصة.** **تغطية** تقص ما لا يتسع للمقطع. غيّروا **موضع الخلفية** لإبقاء الموضوع في العرض، أو اختاروا **احتواء**.
- **التدرج يخفي الصورة.** يجلس التدرج فوقها، والألوان المعتمة تغطي الصورة. اخفضوا شفافية **لون البداية** و**لون النهاية** في منتقي الألوان.
- **المقطع لا يعرض تدرجًا.** يحتاج التدرج اللونين. اختاروا **لون البداية** و**لون النهاية**.
- **فيديو YouTube لا يعمل.** **رابط فيديو YouTube** فارغ أو ليس رابطًا لفيديو واحد. الصقوا العنوان الكامل للفيديو، مثل `https://www.youtube.com/watch?v=` متبوعًا بمعرّفه.

## ما الخطوة التالية؟

- [تخطيطات بعرض الشاشة](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%AA%D8%B5%D9%85%D9%8A%D9%85/%D8%A8%D8%B9%D8%B1%D8%B6-%D8%A7%D9%84%D8%B4%D8%A7%D8%B4%D8%A9-%D8%A7%D9%84%D9%83%D8%A7%D9%85%D9%84): ترك الخلفية والمحتوى يمتدان من حافة إلى حافة.
- [تبويب الحركة](/ar/hc/documentation/learn-dxpr-builder/design/animation-tab): تلاشي النص بينما يُمرَّر المقطع إلى العرض.
- [المقطع البطولي](/ar/hc/%D8%A7%D9%84%D8%AA%D9%88%D8%AB%D9%8A%D9%82/%D8%AA%D8%B9%D9%84%D9%85-dxpr-builder/%D8%A7%D9%84%D8%B4%D8%B1%D9%88%D8%AD%D8%A7%D8%AA/%D9%82%D8%B3%D9%85-%D8%A7%D9%84%D8%A8%D8%B7%D9%84): بناء ترويسة صفحة كاملة مع صورة تزييح.