• css
  • 8935
  • 20-3-2008
  • [color=FA0309]الخاصية font-style :[/color] هذه الخاصية وظيفتها أن تجعل النص مائل :
    H3 { font-style: italic }
    عندما تخبر المتصفح أن يجعل نصاً ما مائل فإنه يبحث عن نسخة مائلة من الخط المطلوب على حاسب المستخدم ، و إذا لم يجدها فإنه في بعض الأحيان يصنع واحدة . أما إذا كنت تعرف أن النسخة المائلة من الخط المطلوب تسمى Oblique فاستخدم القيمة oblique بدلاً من القيمة italic . أما إذا كنت تريد أن تجعل النص غير مائل فاستخدم القيمة normal .

    -------------------------------------------------------

    [color=FA0309]الخاصية font-weight :[/color] مع صفحات الأنماط المتعاقبة يمكنك ليس فقط جعل النص سميك أو عادي ، بل أيضاً يمكنك التحكم في درجات السماكة المختلفة :
    P { font-weight: bold }
    هذه القاعدة واضحة جداً ، لقد جعلت نص الواصفة <P> سميك ، و بالمثل يمكنك وضع القيمة normal بدلاً من bold لجعل النص عادي غير سميك . كذلك يمكنك تحديد القيمة باستخدام قيم رقمية من 100 حتى 900 . الخط العادي غير السميك قيمته 400 ، و أقصى قيمة للسمك هي 900 . و بالطبع هذا يعتمد على نوع الخط المستخدم ، حيث أن الخطوط التي ليس بها غير وجهين فقط (عادي و سميك) سوف تظهر القيم من 100 إلى 600 فيها كخط عادي غير سميك ، و القيم من 700 إلى 900 ستظهر كخط سميك . أما الخطوط التي بها تسعة أوجه مبنية داخلها فسوف تظهر كل قيمة بحجمها الأصلي و لكن احذر فالمتصفحات لا تدعم هذه الخاصية بثبات (و المتصفح IE 3 لا يدعمها على الإطلاق) . و أخيراً .. يمكنك استخدام قيم lighter و bolder ، و هذه القيم سوف تعمل فقط إذا استخدمتهم على عنصر تم تحديد عدة طبقات من السماكة له بالفعل . على سبيل المثال إذا استخدمت القيمة bolder مع عنصر ورث السماكة من عنصر أب ، في هذه الحالة فإن المتصفح سوف يجعل هذا العنصر أكثر سماكة من أبيه ، و إذا لم يكن هناك نسخة أكثر سمكاً من الخط المستخدم فإن المتصفح لن يفعل شيئاً و سيعرض النص بنفس سمك الأب . (المتصفحان IE 3 و نتسكيب كوميونيكتور لا يدعمان هاتان القيمتان) .

    ---------------------------------------------------------

    [color=FA0309]الخاصية text-transform :[/color] هذه الخاصية تستخدم للتحكم في حالة الحروف و جعلها كبيرة Uppercase أو صغيرة Lowercase :
    B { text-transform: uppercase }
    و إليك كل القيم التي يمكن استخدامها مع هذه الخاصية : 1- uppercase : تجعل كل الحروف بحالة كبيرة . THIS SENTENCE SERVES AS AN EXAMPLE 2- lowercase : تجعل كل الحروف بحالة صغيرة . this sentence serves as an example 3- capitalize : تجعل أول حرف من كل كلمة بحالة كبيرة . This Sentence Serves As An Example 4- none : تعني أن أي قيمة للخاصية text-transform قد ورثها النص المقصود من عنصر أب سيتم تجاهلها و سيعرض النص بشكل عادي . This sentence serves as an example و لكن المتصفح IE 3 لا يدعم هذه الخاصية .

    -------------------------------------------------------

    [color=FA0309]الخاصية text-decoration :[/color] كنا و لفترة طويلة للغاية لا نملك أي تصرف بشأن حقيقة أن الوصلات التشعبية النصية تظهر بخط سفلي تحتها في المتصفحات المختلفة ، أنا لا أعرف شعورك حيال هذا و لكني أعتقد أنها قبيحة الشكل و مزعجة . و الحل الذي أقدمه لكم الآن هو هذه الخاصية :
    B { text-decoration: underline }
    و إليك القيم الخاصة بها : underline : تجعل الكلمات تحتها خط . Underline words overline : تجعل الكلمات فوقها خط . Overline words line-through : تجعل الكلمات في وسطها خط . Linethrough words blink : تجعل الكلمات تومض . Blink words none : تتأكد من عدم حدوث أي من القيم السابقة . None words (المتصفح نتسكيب كوميونيكتور لا يدعم القيمة overline ، و المتصفحان IE 4 و IE 5 لا يدعمان القيمة blink ، أما المتصفح IE 3 فلا يدعم أي من هذه القيم .) القيمة none هي قيمة سحرية تستطيع بواسطتها أن تزيل الخط تحت الوصلات التشعبية النصية كالتالي :
    A:link { text-decoration: none } A:active { text-decoration: none } A:visited { text-decoration: none }
    إذا كنت لا تعرف فإن A:link هي التي تحدد شكل الوصلة النصية العادية التي لم يتم النقر عليها ، أما A:active فهي التي تحدد شكل الوصلة أثناء النقر عليها ، و A:visited هي التي تحدد شكل الوصلة التي تم النقر عليها بالفعل من قبل . و القواعد السابقة يمكن أن توضع في صفحات الأنماط المطمورة أو الموصول إليها أو المستوردة ، و لن تتغير شفرة الوصلة التشعبية في الهتمل على الإطلاق :
    <A HREF="https://arab-team.com">Link</a>
    و النتيجة : This text is a link, but it's not underlined انتظر .. مازال هناك المزيد ، يمكنك أيضاً استخدام أي من خصائص صفحات الأنماط المتعاقبة الأخرى مع A:link و A:visited و A:active ، فيمكنك مثلاً جعل الوصلة التي لم يتم النقر عليها بحجم 12 نقطة بخط Arial سميك ، و جعل الوصلة التي تم النقر عليها بحجم عشر نقاط بخط Times New Roman مائل . لكن ليس كل المتصفحات تدعم هذه الخاصية الرائعة بشكل كامل ، فالمتصفح نتسكيب كوميونيكيتور يدعم القيم الأساسية لهذه الخاصية و لا يدعم أي خصائص أو قيم إضافية ، و المتصفح IE 3 لا يدعم A:active ، أما المتصفحان IE 4 و IE 5 فهما الأفضل في دعم هذه الخاصية بشكل كامل .

    --------------------------------------------------

    [color=FA0309]الخاصية font :[/color] هذه الخاصية هي اختصار لعدد من الخواص مجتمعة ، فهي وسيلة لتحديد حجم الخط font-size ، ارتفاع السطر line-height (سنتكلم عن هذه الخاصية لاحقاً) ، و نوع الخط المستخدم font-family ، كل هذا في خاصية واحدة :
    LI { font: 12pt/16pt courier }
    هذه القاعدة تجعل نص الواصفة <LI> بحجم 12 نقطة و بارتفاع سطر 16 نقطة و بخط courier . إذا استعملت هذه الخاصية فيجب عليك أن تحدد حجم الخط و نوعه ، أما بالنسبة لارتفاع السطر فهو اختياري ، و تأكد من أن يكونوا بالترتيب الموضح بالأعلى في المثال
    كن أول من يقيم الموضوع
    12345