تسلسل الاوسمه اضافه قيم خاصة لأوسمة معينه

عنوان الدرس :تسلسل الاوسمه اضافه قيم خاصة لأوسمة معينه

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

وللتوضيح أكثر ساضرب لك مثال بالفقرة التالية :

فقرة واحده وعنوان لها وبداخل كل منهم اضفت وسم em حتى يظهر الخط المحدد بينها مائل .. الان أنا أريد عن طريق css ان أجعل الكلمات المائله فقط بلون معين او بخط معين مثلاً وهذا هو التسلسل الذى اتكلم عنه.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS الأنماط الإنسابية</title>

<style type="text/css">
<!--
h2 em { color : red; }
p em { color : green; }
-->
</style>

</head>
<body>

<h2>cascading <em>style</em> sheets</h2>
<p>تقنية <em>تهتم بتحديد شكل وتصميم المواقع</em> بمرونه وسهولة تامة</p>

</body>
</html>

المثال السابق يتضح عبر الرسم التالي

اخيراً تسلسل الأوسمة لها نفس القواعد في حالة تطبيقها على المعرّفات id# والفئات class. لا يوجد إختلاف، بل يمكنك عمل تحكمات أكثر بالأوسمة لو أرتبطت بمعرّف ما