في هذا الدرس 3تصفّح المواضيع
CSS Background Attachment
تحريك وثبات صورة الخلفية في لغة CSS
CSS Background Attachment تحريك وثبات صورة الخلفية في لغة CSS
تستخدم خاصية background-attachment لعمل خلفيات ثابته أو خلفيات متحركة عند تحريك scroll الفأرة mouse لأعلي ولأسفل الصفحة.
قيم خاصية background-attachment:
- scroll وهي القيمة الأفتراضية وهي تحريك صورة الخلفية مع تحريك scroll, إذا كانت الصورة في مقدمة صفحة HTML سوف يتم إخفاءها عند عمل scroll إلي اسفل الصفحة.
- fixed وهي ثبات صورة الخلفية مع تحريك scroll وتظل الصورة في موضعهاً الأصلي مهما تم تحريك scroll.
قيم خاصية background-attachment
background-attachment: scroll|fixed|local|initial|inherit;
CSS background-attachment scroll
قيمة scroll مع خاصية background-attachment في لغة CSS
CSS background-attachment scroll قيمة scroll مع خاصية background-attachment في لغة CSS
الوضع الافتراضي للخلفية هو scroll يمكنك استخدام background-attachment مع القيمة scroll ليتم تحريك الخلفية مع scroll عدم ثبات الخلفية.
CSS background attachment scroll
يتم تحريك الخلفية مع تحريك scroll.
body
{
background-image:url('https://www.closetag.com/images/background.jpg');
background-repeat:no-repeat;
background-attachment: scroll;
}
CSS background attachment fixed
قيمة fixed مع خاصية background-attachment في لغة CSS
CSS background attachment fixed قيمة fixed مع خاصية background-attachment في لغة CSS
تستخدم خاصية background-attachment مع القيمة fixed في لغة CSS لعمل خلفيات ثابتة عند القيام بتحريك scroll لأعلي ولأسفل لا تتحرك ثورة الخلفية وتكون في موضعها الحالي في صفحة الويب.
CSS background attachment fixed
تحريك صورة الخلفية عند تحريك scroll لأعلي ولأسفل.
body
{
background-image:url('https://www.closetag.com/images/background.jpg');
background-repeat:no-repeat;
background-attachment: fixed;
}سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.
المصطلحات7
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 Attachment إرفاق / اداة ملحقة
- للمراجعة
- 02 Background خلفية
- للمراجعة
- 03 Scroll تنقل من الأعلي الي الأسفل
- للمراجعة
- 04 Property خاصية
- للمراجعة
- 05 Value قيمة
- للمراجعة
- 06 Fixed ثابت
- للمراجعة
- 07 Break Line خط فاصل
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
الاختصارات2
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 CSS CSS
- Cascading Style Sheets
- صفحات الأنماط الانسيابية
- للمراجعة
- 02 HTML HTML
- Hypertext Markup Language
- لغة توصيف النص الفائق الخاصة ببناء صفحة الإنترنت<p><a href="https://www.closetag.com/tutorial/html/html-introduction">المزيد عن HTML</a></p>
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
اختبر فهمك.
ووصلها للإتقان.
كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.
أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.
الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.