Xacker
16-03-2003, 10:54 PM
شرح تعليمتي <SPAN>..</SPAN>-<DIV>..</DIV>:
------------------------------------------
نتابع ما بدأناه الدرس الماضي بشرح استخدام تعليمتين مهمتين هما <SPAN> <DIV>
<SPAN>..</SPAN>:
----------------
اسم العنصر: معرف المدى
وصف العنصر: يقوم باعداد معلومات CSS لقسم محدد ضمن صفحة الويب
سمات العنصر: CHARSET=ISO-# وتشير الى شيفرة الرموز الدولية المستخدمة في الوصلة التشعبية
HREF=URL تشير الى صفحة ويب التي يتم عرضها عندما يتم تفعيل المحتويات الموجودة ضمن المعرف <SPAN>
HREFLANG=text تحدد اللغة الاساسية للمصدر المشار اليه بالسمة HREF
MEDIA-ALL|BRAILLE|PRINT|PROJECTION|SCREEN|SPEEC تحدد نوع الوسيط الذي تم تصميم تحديد CSS من اجله
REL=URL تشير الى عنوان URL للمستند الفرعي. وهي ليست شائعة الاستخدام
REV=URL تشير الى عنوان المستند الاب. هذه السمة ليست شائعة الاستخدام
TARGET=frame name تحدد اسم الاطار (اذا وجد) الذي يجب ان يقوم بعرض المحتويات المشار اليها بواسطة HREF
TYPE=MIME type تحدد نوع ال MIME للمحتويات المحاطة بمعرف الاسلوب
المعرفات المرافقة: <STYLE>
مثال:
<HTML>
<HEAD>
<STYLE>
SPAN {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<P STYLE="COLOR: GREEN">
انظر الى <SPAN>النص الاحمر</SPAN> الذي يظهر ضمن النص الاخضر
</P>
</BODY>
</HTML>
تم تصميم المعرف <SPAN> لليطرة المؤقتة على اية معلومات CSS قد يختمل وجودها.
وهي تملك سمة خاصة بها هي : STYLE.
يمكن استخدام السمة STYLE للحصول على المزيد من التحسين في عنصر CSS المعروض. على سبيل المثال, اذا اردت جعل النص الاحمر من الشيفرة السابقة بحجم 18 نقطة يمكنك استخدام الشفرة التالية:
<HTML>
<HEAD>
<STYLE>
SPAN {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<P STYLE="COLOR:GREEN">
انظر الى <SPAN STYLE="FONT-SIZE: 18 PT">النص الاحمر ذي الحجم 18 نقطة</SPAN> الذي يظهر ضمن النص الاخضر
</P>
</BODY>
</HTML>
يملك المعرف <SPAN> الكثير من السمات وقد تمت اضافة الكثير منها الى مواصفات HTML 4.0 الرسمية
ولم يتم انجاز اي منهم ضمن المتصفحات الحالية. يتم استخدام السمة CHARSET لتحديد شيفرة الرموز الدولية المستخدمة في الوصلات التشعبية. القيمة الافتراضية هي شيفرة LATIN-1 ISO القياسية التي يتم استخدامها في معظم اللغات الاوروبية (بما فيها الانكليزية) ويمكن تحديد مجموعات رموز بديلة
يتم استخدام السمة TYPE لتحديد نوع ال MIME لنوع الملف الذي تشير اليه مرساة النص التشعبي
تقوم السمة الغامضة HREFLANG باعداد اللغة الاساسية للمورد الذي سيتم الارتباط به
تمكن السمة HREF مؤلف ويب من تحويل المحتويات المحتواة ضمن مجموعة من معرفات <SPAN> الى وصلة تشعبيةوتقوم السمة المرافقة TARGET بتحديد اسم الاطار الذي سيتم عرض الوصلة ضمنه اذا تم احتواء المحتويات ضمن صفحة ويب مؤطرة
كما يمكن تنفيذ CSS ضمن جزء محدد او قسم من صفحة ويب
تسمح هذه الفكرة لمؤلق ويب بالقدرة على اضافة المزيد من سمات CSS ضمن جزء من صفحة ويب
يحوي معرف التقسيم <DIV> اقسام CSS في صفحة ويب والذي تم تصميمه لاعداد قواعد CSS للاقسام التي يحويها.
<DIV>..</DIV>:
--------------
اسم العنصر: معرف التقسيم
وصف العنصر: يحدد قسما من صفحة ويب حيث سيتم استخدام عناصر CSS فيه
سمات العنصر: CHARSET=ISO-# تشير الى شيفرة الرموز الدولية المستخدمة في الوصلة التشعبية
HREF=URL تشير الى صفحة ويب التي سيتم عرضها عندما يتم تفعيل المحتويات الموجودة ضمن المعرف <SPAN>
HREFLANG=text تحدد اللغة الاساسية للمصدر المشار اليه في السمة HREF
MEDIA-ALL|BRAILLE|PRINT|PROJECTION|SPEECH|SCREEN تحدد نوع الوسيط الذي تم تصميم تحديد CSS من اجله
REL=URL
REV=URL
TARGET=frame name تحدد اسم الاطار (اذا وجد) الذي يجب ان يقوم بعرض المحتويات المشار اليها بواسطة HREF
TYPE=MIME type تحدد نوع MIME للمحتويات المحاطة بمعرف الاسلوب
مثال:
<HTML>
<HEAD>
</HEAD>
<BODY>
هذا النص يتم عرضه بشكل طبيعي
<DIV STYLE=FONT-SIZE: 18 PT; COLOR: RED">
اما هذا فهو نص احمر حجمه 18 نقطة
<B><I>ما زال</I></B> احمر وبحجمه ذاك
<P>
</DIV>
وها قد عدنا للشكل الطبيعي
</BODY>
</HTML>
تحت مواصفات HTML 4.0 يشارك المعرف <DIV> جميع سمات المعرف <SPAN>
يمكنك استخدام المعرف <DIV> عندما تريد السيطرة على خصائص CSS الموجودة في المكان الذي تريد تعديله. ويقوم هذا المعرف باعداد خصائص CSS عندما لا تكون هناك خصائص محددة كمات في المثال السابق
او يقوم بالسيطرة على اية خصائص CSS موجودة ومعدة في مكان ما ضمن صفحة ويب
يملك المعرف <DIV> سمة واحدة قابلة للاستخدام حاليا وهي ALIGN حيث تسمج لمؤلف ويب بوضع النص في صفحة ويب اما الى الطرف الايسر لنافذة المتصفح باستخدام القيمة LEFT او الى الطرف الايمن باستخدام القيمة RIGHT او في المركز باستخدام القيمة CENTER وهناك قيمة رابعة JUSTIFY تقوم بضبط كتلة من النص المجتوى ضمن المعرف <DIV> لكنها غير مدعومة في مستكشف الانترنيت ولا في متصفح NETSCAPE
كما يقدم لنا المعرف <DIV> المعنى وراء الجزء المتعاقب من صفائح الاساليب المتعاقبة وهو المزيد من قواعد CSS بقصد السيطرة على القواعد العامة
ادرك مصممو CSS انه ستكون هناك حالات سيرغب فيها مؤلف ويب بالسيطرة على المزيد من عناصر CSS العامة بواسطة عناصر اخرى وفي هذه الحالة يقوم المتصفح بالتعقب من قواعد اكثر عموما الى قواعد اكثر تحديدا يتم تعريف ترتيب هذا التعاقب بالقواعد التالية:
1- يتم التطبيق العام لقواعد التنسيق العام على صفحة ويب
2- تقوم قواعد تنسيق محددة ضمن صفحة ويب بالسيطرة على القواعد العامة
3- اذا تم تحديد اثنين او اكثر من عناصر التنسيق ضمن صفحة ويب سيتم تطبيق العنصر الاخير
تبين هذه الشفرة ذلك التعاقب بالشكل: يتم اعداد عنوان من المستوى الاول باللون الازرق البحري NAVY بحيث يسيطر على القاعدة العامة التي تقوم باعداد عنوان المستوى الاول باللون الاحمر
<HTML>
<HEAD>
<STYLE>
H1 {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<H1> نص من المستوى الاول</H1>
<H1 STYLE="COLOR: NAVY">
فجاة يتغير النص الى اللون الازرق البحري</H1>
<H1>ثم يعود الى اللون الاحمر للمستوى الاول</H1>
</BODY>
</HTML>
تاكد من الشكل في صفحة ويب.
لاحظ كيف يتم عرض السطر الثاني لعنوان المستوى الاول باللون الازرق البحري بينما يتم عرض عنوان السطرين الاول والثالث للمستوى الاول باللون الاحمر
يرث السطر الاول لعنوان المستوى الاول سمة اللون الاحمر والذي تتم السيطرة عليه في السطر الثاني لعنوان المستوى الاول ثم يتم استرجاعه في السطر لعنوان المستوى الاول (دختوا مش هيك خخخخ عارف حتى انا عم اقراه اكتر من مرة عشان ما كون كررت شي بالغلط من كتر ما قلت مستوى اول سطر اول خخخخخ يالله كله في سبيل المعرفة يهون تابعوا)
احدى الورطات الاساية التي تحدث في مواصفات CSS هي انك لدى تخصيص قيم تنسيق لنوع معرف عالي المستوى (مثل المعرف <BODY>) سترث جميع المعرفات التي تحته نفس اعدادات معرف المستوى العالي وذلك بشكل تلقائي ما لم تقم بالسيطرة عليها بشكل خاص في مكان ما
فاذا وضعت عناصر CSS معينة في المعرف <BODY> فان كافة النصوص القوائم والجداول تتم بواسطتها اضافة معلومات CSS الى صفحة ويب:
1- يمكن تضمينها ضمن عنوان صفحة الويب
2- يمكن تضمينها ضمن جسم صفحة ويب (في اقسام از اجزاء معينة عادة)
3- يمكن تحديدها ضمن صفحة ويب منفصلة
هذا هو درسنا لليوم ارجو ان تكون هذه السلسة مفيدة لكن بقدر ما هي مراجعة لمعلوماتي اللي على شوي رح تصدي خخخخخخخخ وما تواخذوني ارتايت بان اتكلم بالفصحى بالسنبة لنص الدرس عشان الكل يفهم علي ما احكي شي كلمة بلهجتي يصير ارتباك احسن هيك واريح للجميع
رجعوا راجعوا الدرس مرة تانية اوكيه
في الدرس القادم سنتكلم عن استخداد وربط شفرات CSS بصفحة اخرى لصفحة ويب في موقعنا ويمكن اذا كنت مروق علمكم كيف تحموا الصفحة باستخدام CSS وخاصة DISABLED للمعرف <STYLE> ;) :P
المهم باي هلق
--------------------- تحياتي FATAL-TERROR -----------------------
------------------------------------------
نتابع ما بدأناه الدرس الماضي بشرح استخدام تعليمتين مهمتين هما <SPAN> <DIV>
<SPAN>..</SPAN>:
----------------
اسم العنصر: معرف المدى
وصف العنصر: يقوم باعداد معلومات CSS لقسم محدد ضمن صفحة الويب
سمات العنصر: CHARSET=ISO-# وتشير الى شيفرة الرموز الدولية المستخدمة في الوصلة التشعبية
HREF=URL تشير الى صفحة ويب التي يتم عرضها عندما يتم تفعيل المحتويات الموجودة ضمن المعرف <SPAN>
HREFLANG=text تحدد اللغة الاساسية للمصدر المشار اليه بالسمة HREF
MEDIA-ALL|BRAILLE|PRINT|PROJECTION|SCREEN|SPEEC تحدد نوع الوسيط الذي تم تصميم تحديد CSS من اجله
REL=URL تشير الى عنوان URL للمستند الفرعي. وهي ليست شائعة الاستخدام
REV=URL تشير الى عنوان المستند الاب. هذه السمة ليست شائعة الاستخدام
TARGET=frame name تحدد اسم الاطار (اذا وجد) الذي يجب ان يقوم بعرض المحتويات المشار اليها بواسطة HREF
TYPE=MIME type تحدد نوع ال MIME للمحتويات المحاطة بمعرف الاسلوب
المعرفات المرافقة: <STYLE>
مثال:
<HTML>
<HEAD>
<STYLE>
SPAN {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<P STYLE="COLOR: GREEN">
انظر الى <SPAN>النص الاحمر</SPAN> الذي يظهر ضمن النص الاخضر
</P>
</BODY>
</HTML>
تم تصميم المعرف <SPAN> لليطرة المؤقتة على اية معلومات CSS قد يختمل وجودها.
وهي تملك سمة خاصة بها هي : STYLE.
يمكن استخدام السمة STYLE للحصول على المزيد من التحسين في عنصر CSS المعروض. على سبيل المثال, اذا اردت جعل النص الاحمر من الشيفرة السابقة بحجم 18 نقطة يمكنك استخدام الشفرة التالية:
<HTML>
<HEAD>
<STYLE>
SPAN {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<P STYLE="COLOR:GREEN">
انظر الى <SPAN STYLE="FONT-SIZE: 18 PT">النص الاحمر ذي الحجم 18 نقطة</SPAN> الذي يظهر ضمن النص الاخضر
</P>
</BODY>
</HTML>
يملك المعرف <SPAN> الكثير من السمات وقد تمت اضافة الكثير منها الى مواصفات HTML 4.0 الرسمية
ولم يتم انجاز اي منهم ضمن المتصفحات الحالية. يتم استخدام السمة CHARSET لتحديد شيفرة الرموز الدولية المستخدمة في الوصلات التشعبية. القيمة الافتراضية هي شيفرة LATIN-1 ISO القياسية التي يتم استخدامها في معظم اللغات الاوروبية (بما فيها الانكليزية) ويمكن تحديد مجموعات رموز بديلة
يتم استخدام السمة TYPE لتحديد نوع ال MIME لنوع الملف الذي تشير اليه مرساة النص التشعبي
تقوم السمة الغامضة HREFLANG باعداد اللغة الاساسية للمورد الذي سيتم الارتباط به
تمكن السمة HREF مؤلف ويب من تحويل المحتويات المحتواة ضمن مجموعة من معرفات <SPAN> الى وصلة تشعبيةوتقوم السمة المرافقة TARGET بتحديد اسم الاطار الذي سيتم عرض الوصلة ضمنه اذا تم احتواء المحتويات ضمن صفحة ويب مؤطرة
كما يمكن تنفيذ CSS ضمن جزء محدد او قسم من صفحة ويب
تسمح هذه الفكرة لمؤلق ويب بالقدرة على اضافة المزيد من سمات CSS ضمن جزء من صفحة ويب
يحوي معرف التقسيم <DIV> اقسام CSS في صفحة ويب والذي تم تصميمه لاعداد قواعد CSS للاقسام التي يحويها.
<DIV>..</DIV>:
--------------
اسم العنصر: معرف التقسيم
وصف العنصر: يحدد قسما من صفحة ويب حيث سيتم استخدام عناصر CSS فيه
سمات العنصر: CHARSET=ISO-# تشير الى شيفرة الرموز الدولية المستخدمة في الوصلة التشعبية
HREF=URL تشير الى صفحة ويب التي سيتم عرضها عندما يتم تفعيل المحتويات الموجودة ضمن المعرف <SPAN>
HREFLANG=text تحدد اللغة الاساسية للمصدر المشار اليه في السمة HREF
MEDIA-ALL|BRAILLE|PRINT|PROJECTION|SPEECH|SCREEN تحدد نوع الوسيط الذي تم تصميم تحديد CSS من اجله
REL=URL
REV=URL
TARGET=frame name تحدد اسم الاطار (اذا وجد) الذي يجب ان يقوم بعرض المحتويات المشار اليها بواسطة HREF
TYPE=MIME type تحدد نوع MIME للمحتويات المحاطة بمعرف الاسلوب
مثال:
<HTML>
<HEAD>
</HEAD>
<BODY>
هذا النص يتم عرضه بشكل طبيعي
<DIV STYLE=FONT-SIZE: 18 PT; COLOR: RED">
اما هذا فهو نص احمر حجمه 18 نقطة
<B><I>ما زال</I></B> احمر وبحجمه ذاك
<P>
</DIV>
وها قد عدنا للشكل الطبيعي
</BODY>
</HTML>
تحت مواصفات HTML 4.0 يشارك المعرف <DIV> جميع سمات المعرف <SPAN>
يمكنك استخدام المعرف <DIV> عندما تريد السيطرة على خصائص CSS الموجودة في المكان الذي تريد تعديله. ويقوم هذا المعرف باعداد خصائص CSS عندما لا تكون هناك خصائص محددة كمات في المثال السابق
او يقوم بالسيطرة على اية خصائص CSS موجودة ومعدة في مكان ما ضمن صفحة ويب
يملك المعرف <DIV> سمة واحدة قابلة للاستخدام حاليا وهي ALIGN حيث تسمج لمؤلف ويب بوضع النص في صفحة ويب اما الى الطرف الايسر لنافذة المتصفح باستخدام القيمة LEFT او الى الطرف الايمن باستخدام القيمة RIGHT او في المركز باستخدام القيمة CENTER وهناك قيمة رابعة JUSTIFY تقوم بضبط كتلة من النص المجتوى ضمن المعرف <DIV> لكنها غير مدعومة في مستكشف الانترنيت ولا في متصفح NETSCAPE
كما يقدم لنا المعرف <DIV> المعنى وراء الجزء المتعاقب من صفائح الاساليب المتعاقبة وهو المزيد من قواعد CSS بقصد السيطرة على القواعد العامة
ادرك مصممو CSS انه ستكون هناك حالات سيرغب فيها مؤلف ويب بالسيطرة على المزيد من عناصر CSS العامة بواسطة عناصر اخرى وفي هذه الحالة يقوم المتصفح بالتعقب من قواعد اكثر عموما الى قواعد اكثر تحديدا يتم تعريف ترتيب هذا التعاقب بالقواعد التالية:
1- يتم التطبيق العام لقواعد التنسيق العام على صفحة ويب
2- تقوم قواعد تنسيق محددة ضمن صفحة ويب بالسيطرة على القواعد العامة
3- اذا تم تحديد اثنين او اكثر من عناصر التنسيق ضمن صفحة ويب سيتم تطبيق العنصر الاخير
تبين هذه الشفرة ذلك التعاقب بالشكل: يتم اعداد عنوان من المستوى الاول باللون الازرق البحري NAVY بحيث يسيطر على القاعدة العامة التي تقوم باعداد عنوان المستوى الاول باللون الاحمر
<HTML>
<HEAD>
<STYLE>
H1 {COLOR: RED}
</STYLE>
</HEAD>
<BODY>
<H1> نص من المستوى الاول</H1>
<H1 STYLE="COLOR: NAVY">
فجاة يتغير النص الى اللون الازرق البحري</H1>
<H1>ثم يعود الى اللون الاحمر للمستوى الاول</H1>
</BODY>
</HTML>
تاكد من الشكل في صفحة ويب.
لاحظ كيف يتم عرض السطر الثاني لعنوان المستوى الاول باللون الازرق البحري بينما يتم عرض عنوان السطرين الاول والثالث للمستوى الاول باللون الاحمر
يرث السطر الاول لعنوان المستوى الاول سمة اللون الاحمر والذي تتم السيطرة عليه في السطر الثاني لعنوان المستوى الاول ثم يتم استرجاعه في السطر لعنوان المستوى الاول (دختوا مش هيك خخخخ عارف حتى انا عم اقراه اكتر من مرة عشان ما كون كررت شي بالغلط من كتر ما قلت مستوى اول سطر اول خخخخخ يالله كله في سبيل المعرفة يهون تابعوا)
احدى الورطات الاساية التي تحدث في مواصفات CSS هي انك لدى تخصيص قيم تنسيق لنوع معرف عالي المستوى (مثل المعرف <BODY>) سترث جميع المعرفات التي تحته نفس اعدادات معرف المستوى العالي وذلك بشكل تلقائي ما لم تقم بالسيطرة عليها بشكل خاص في مكان ما
فاذا وضعت عناصر CSS معينة في المعرف <BODY> فان كافة النصوص القوائم والجداول تتم بواسطتها اضافة معلومات CSS الى صفحة ويب:
1- يمكن تضمينها ضمن عنوان صفحة الويب
2- يمكن تضمينها ضمن جسم صفحة ويب (في اقسام از اجزاء معينة عادة)
3- يمكن تحديدها ضمن صفحة ويب منفصلة
هذا هو درسنا لليوم ارجو ان تكون هذه السلسة مفيدة لكن بقدر ما هي مراجعة لمعلوماتي اللي على شوي رح تصدي خخخخخخخخ وما تواخذوني ارتايت بان اتكلم بالفصحى بالسنبة لنص الدرس عشان الكل يفهم علي ما احكي شي كلمة بلهجتي يصير ارتباك احسن هيك واريح للجميع
رجعوا راجعوا الدرس مرة تانية اوكيه
في الدرس القادم سنتكلم عن استخداد وربط شفرات CSS بصفحة اخرى لصفحة ويب في موقعنا ويمكن اذا كنت مروق علمكم كيف تحموا الصفحة باستخدام CSS وخاصة DISABLED للمعرف <STYLE> ;) :P
المهم باي هلق
--------------------- تحياتي FATAL-TERROR -----------------------