عناصر CSS الزائفة - شركة انكور التطويرية

بسم الله الرحمن الرحيم في درس سابق شرحت ما هي الفئات الزائفة الكلاسات الزائفة وفي هذا الموضوع سأشرح لكم العناصر الزائفة يتم استخدام عنصر CSS الزائف لتصمي ..

عناصر,الزائفة,keyword

عناصر CSS الزائفة - شركة انكور التطويرية

دليل انكور للمواقع





القوانين العامة لشركة انكور التطويرية | وجب على الجميع القراءة والالتزام



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


عناصر CSS الزائفة

بسم الله الرحمن الرحيم في درس سابق شرحت ما هي الفئات الزائفة quot;الكلاسات الزائفةquot; وفي هذا الموضوع سأشرح لكم العنا ..


لا يمكنك الرد على هذا الموضوع لا يمكنك إضافة موضوع جديد


Admin
.:: مؤسس انكور ::.
معلومات الكاتب ▼
تاريخ الإنضمام : 15-01-2020
رقم العضوية : 1
المشاركات : 1291
الدولة : فلسطين
الجنس : ذكر
تاريخ الميلاد : 11-9-1998
الدعوات : 9
قوة السمعة : 70
موقعي : زيارة موقعي
 offline 
27-06-2020 08:40 مساء
بسم الله الرحمن الرحيم

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

ieo10
تركيب العناصر الزائفة:
selector::pseudo-element {
  property: value;
}

ieo10
العنصر ::first-line العنصر الزائف للسطر الأول
يستخدم العنصر الزائف first-line:: لإضافة نمط خاص إلى السطر الأول من النص.
ينسق المثال التالي السطر الأول من النص في جميع عناصر <p>:
p::first-line {
  color: #ff0000;
  font-variant: small-caps;
}


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

ieo10
تنطبق الخصائص التالية على العنصر الزائف للخط الأول:
خصائص الخط
خصائص اللون
خصائص الخلفية
تباعد الكلمات
تباعد الحروف
زخرفة النص
محاذاة رأسية
تحويل النص
ارتفاع خط
الوضوح

لاحظ تدوين القولون المزدوج - :: السطر الأول مقابل: السطر الأول
استبدل القولون المزدوج ترميز القولون الفردي للعناصر الزائفة في CSS3. كانت هذه محاولة من W3C للتمييز بين الفئات الزائفة والعناصر الزائفة.
تم استخدام بناء الجملة أحادي القولون لكل من الفئات الزائفة والعناصر الزائفة في CSS2 و CSS1.
للتوافق مع الإصدارات السابقة ، يُعد بناء الجملة أحادي القولون مقبولًا للعناصر الزائفة CSS2 و CSS1.

ieo10
العنصر الأول: ::first-letter
يستخدم العنصر الزائف ::first-letter لإضافة نمط خاص للحرف الأول من النص.
ينسق المثال التالي الحرف الأول من النص في جميع عناصر <p>:
p::first-letter {
  color: #ff0000;
  font-size: xx-large;
}


ملاحظة: لا يمكن تطبيق العنصر الزائف للحرف الأول إلا على عناصر مستوى الكتلة.

ieo10
تنطبق الخصائص التالية على العنصر الزائف للحرف الأول:
خصائص الخط
خصائص اللون
خصائص الخلفية
خصائص الهامش
خصائص الحشو
خصائص الحدود
زخرفة النص
محاذاة رأسية (فقط إذا كانت كلمة "تعويم" هي "لا شيء")
تحويل النص
ارتفاع خط
تطفو
الوضوح

ieo10
العناصر الزائفة وفئات CSS
يمكن دمج العناصر الزائفة مع فئات CSS:
p.intro::first-letter {
  color: #ff0000;
  font-size: 200%;
}


سيعرض المثال أعلاه الحرف الأول من الفقرات مع class = "intro" ، باللون الأحمر وفي حجم أكبر.

ieo10
عناصر زائفة متعددة
يمكن أيضًا دمج العديد من العناصر الزائفة.
في المثال التالي ، سيكون الحرف الأول من الفقرة باللون الأحمر ، بحجم خط كبير جدًا. سيكون باقي السطر الأول باللون الأزرق وبأحرف صغيرة. سيكون باقي الفقرة حجم ولون الخط الافتراضي:
p::first-letter {
  color: #ff0000;
  font-size: xx-large;
}

p::first-line {
  color: #0000ff;
  font-variant: small-caps;
}

ieo10
CSS - العنصر الزائف  ":: before"
يمكن استخدام العنصر الزائف ":: before" لإدراج بعض المحتوى قبل محتوى العنصر.
يدرج المثال التالي صورة قبل محتوى كل عنصر <h1>:
h1::before {
  content: url(smiley.gif);
}

ieo10
CSS - The :: after العنصر الزائف
يمكن استخدام العنصر :: after العنصر الزائف لإدراج بعض المحتوى بعد محتوى العنصر.
يدرج المثال التالي صورة بعد محتوى كل عنصر <h1>:
h1::after {
  content: url(smiley.gif);
}

ieo10
CSS - العنصر الزائف ":: selection"
يتطابق العنصر الزائف ":: select" مع جزء العنصر الذي حدده المستخدم.
يمكن تطبيق خصائص CSS التالية على ":: select:" اللون والخلفية والمؤشر والمخطط التفصيلي.
المثال التالي يجعل النص المحدد أحمر على خلفية صفراء:
::selection {
  color: red;
  background: yellow;
}


وستجد في الموضوع القديم عن الفئات او الكلاسات الزائفة مستند يحمل جميع العناصر الزائفة

ieo10
انتهى الشرح
بالتوفيق للجميع
جميع الحقوق محفوظة للرؤية الروابط والمرفقات عليك الرد على الموضوع
يمنع النقل دون ذكر المصدر
والسلام ختام



:. كاتب الموضوع Admin ، المصدر: عناصر CSS الزائفة .:


ukhwv CSS hg.hztm

توقيع :Admin
للتواصل مع الادارة بشأن اي موضوع : لمشاهدة الروابط يلزمك التسجيل


24-07-2020 09:23 صباحا
مشاهدة مشاركة منفردة [1]
zoolraqey
.:: عضو مشارك ::.
معلومات الكاتب ▼
تاريخ الإنضمام : 23-07-2020
رقم العضوية : 249
المشاركات : 58
الجنس : ذكر
تاريخ الميلاد : 27-10-1998
قوة السمعة : 10
 offline 
جزاك الله خير 

موفق ان شاء الله




الكلمات الدلالية
عناصر ، الزائفة ،

« فئات CSS الزائفة | [الدرس الثاني] محددات Css »

 














الساعة الآن 10:55 مساء


جميع حقوق تصميم الاستايل محفوظة لابو كريم وتحويل الاستايل لسليمان


RSS 2.0XML Site MapArchiveTeamContactCalendarStatic Forum