|
|
• الانـتـسـاب » Jun 2010
|
|
• رقـم العـضـويـة » 71305
|
|
• المشـــاركـات » 5,572
|
|
• الـدولـة » Egypt
|
|
• الـهـوايـة » <HTML>
|
|
• اسـم الـسـيـرفـر » Private Server
|
|
• الـجـنـس » Male
|
|
• نقـاط التقييم » 102
|
|
|
|
تعلم HTML : دورة احتراف لغة الـ HTML من الالف الى الياء ( تابع للدرس الرابع ) .

الجزء الثانى من الدرس الرابع فى لغة الـ HTML ...

أهلا وسهلا بكم اعضاء و زوار منتدى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ,,
سوف نستكمل حديثنا اليوم عن اساسيات تنسيق الصفحة وسيكون كلامنا اليوم عن القوائم ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
دعونا نستعيد سريعا ما تم ذكره فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] ,,
لقد قمنا بشرح الوسم <P> والخصائص المرتبطة به ,,
قمنا بشرح الخاصية DIR والتى نستخدمها أيضاً مع <P> و تقوم بتحديد إتجاه قراءة النص وتأخذ القيم ,,
LTR وتعنى Left To Right ..
RTL وتعنى Right To Left ..
قمنا بشرح خاصية الاقتباس لتنسيق الفقرات <BLOCKQUOTE>___</BLOCKQUOTE> ..

وفى درسنا اليوم سوف نتكلم عن القوائم ,,
قبل الدخول فى الدرس رجاء تامل فى هذه الصورة >>

ما هو استنتاجك المبدئى لهذه الصورة ؟
ولا تنسى اننا قد ذكرنا فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ]
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
|
|
المشاركة الأصلية كتبت بواسطة 3ashek El7ozn
عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ]
ان المتصفحات لا تتعامل مع الفراغات الزائدة بانها مسافات او فواصل او فقرات ودليل على ذلك ,,
| |
<HTML>
<HEAD>
<TITLE>
My
First
HTML
Page
</TITLE>
</HEAD>
<BODY>
HTML
Guide
By
3ashek
El7ozn
&
Silkroad
4
arab
Fourm
</BODY>
</HTML>
| 
|
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
الاستنتاج الثانى لك هو اننى قمت باستخدام الوسم الخاص باضافة الفراغات , و الوسم <BR> للانتقال الى سطر جديد كما قمنا بذكره فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ] .
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
والوسم <TT>___</TT> الذى يستخدم فى توحيد المسافات بين الاحرف , كما ذكرنا فى عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ]
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
|
|
المشاركة الأصلية كتبت بواسطة 3ashek El7ozn
عفوا ,,, لايمكنك مشاهده الروابط لانك غير مسجل لدينا [ للتسجيل اضغط هنا ]
كما انه يستخدم الوسمين <TT>___</TT> فى توحيد المسافات بين الاحرف بمعنى انه اذا استخدمنا الحرفين M و I كمثال ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
قبل اضافة الوسم >>
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
IIIIIIIIII
<BR>
MMMMMMMMMM
</BODY>
</HTML>
| النتيجة ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
بعد اضافة الوسم >>
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
<TT>
IIIIIIIIII
<BR>
MMMMMMMMMM
</TT>
</BODY>
</HTML>
| النتيجة ,,

|

ولكن الامر غير ذلك تماماً ولكن بالنسبة لاستنتاجك فلا بأس به ولكن الطريقة الصحيحة لعمل مثل هذه الصفحة >>

هو استخدام الوسمين <PRE>___</PRE> فاحتفظ النص بالتنسيق المكتوب به هكذا ,,
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY><FONT COLOR="FF0000"><H1><PRE>
H T M L
G U I D E
B Y
3 A S H E K
E L 7 O Z N
&
S I L K R O A D
F O R
A R A B
F O R U M
</FONT></H1></PRE>
</BODY>
</HTML>
| النتيجة كما سبق :-

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
ولكن اذا لم يتم كتابة الوسمين ..
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY><FONT COLOR="FF0000"><H1>
H T M L
G U I D E
B Y
3 A S H E K
E L 7 O Z N
&
S I L K R O A D
F O R
A R A B
F O R U M
</FONT></H1>
</BODY>
</HTML>
| ستكون النتيجة ,,


والان نبدا فى درسنا اليوم وسوف نتحدث فيه عن القوائم ......
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
مبدئيا عليك ان تعلم بان لغة HTML تحتوى على مجموعة من الوسوم الخاصة بتنظيم البيانات في القوائم وسنقوم بسرد النوعين الاكثر شيوعاً الا وهما ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
Ordered Lists او المتسلسلة وتكون بهذا الشكل ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
وثانيهما Unordered Lists او الغير متسلسلة وتكون بهذا الشكل ,,


وهنا السؤال هل قمت بـ اضافة ارقام واستخدام الوسم <BR> للانتقال الى سطر جديد ؟
هل قمت باستخدام تلك النقطة السوداء ( ● ) ثم استخدمت الوسم <BR> للانتقال الى سطر جديد ؟
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
الإجابة بالطبع لا فالامر ابسط بكثير ,,
يمكنك ان تستخدم القوائم المتسلسلة Ordered Lists بواسطة اضافة الوسم <OL>___</OL> هكذا >>
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
<OL>
<LI>HTML
<LI>Guide
<LI>By
<LI>3ashek El7ozn
<LI>&
<LI>Silkroad4arab Forum
</OL>
</BODY>
</HTML>
| وستحصل على النتيجة ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
اما بالنسبة للقوائم الغير متسلسلة Unordered Lists يتم استخدام الوسم <UL>___</UL> معها بهذا الشكل ,,
| |
<HTML>
<HEAD>
<TITLE>My First HTML Page</TITLE>
</HEAD>
<BODY>
<UL>
<LI>HTML
<LI>Guide
<LI>By
<LI>3ashek El7ozn
<LI>&
<LI>Silkroad4arab Forum
</UL>
</BODY>
</HTML>
| وستكون النتيجة ,,


اعرف ما يدور براسك !!
لماذا الوسم <LI> ؟ وما الذى يفعله !!
باختصار شديد الوسم <LI> يستخدم فى تعيين كل بند من بنود القائمة وهو وسم مفرد ليس له نهاية ,, ويعنى List Item .

نذهب الان الى شاطر اخر وهو الخواص التى يمكن اضافتها لـ هذه الوسوم >>
الخاصية الوحيدة التى يمكن ان نستخدمها مع هذه الوسوم هى TYPE حيث انها تحدد شكل الرمز الظاهر مع بنود القائمة .
وتكون بهذه الشكل >>
حيث يمكنك تغيير الترتيب الافتراضى للقوائم عن طريق اضافة الخاصية TYPE مع احد القيم التالية لتغيير الترتيب الافتراضى وهو الارقام ,,
وتتكون هذه القيم من >>
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
القيمة ( i ) وتستخدم فى اضافة ترتيب باستخدام الارقام الرومانية بحروف صغيرة هكذا ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
القيمة ( I ) وتستخدم كذلك فى اضافة ترتيب باستخدام الارقام الرومانية بحروف كبيرة هكذا ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
القيمة ( a ) وتستخدم فى اضافة ترتيب باستخدم حروف انجليزية صغيرة هكذا ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
القيمة ( A ) وتستخدم كذلك فى اضافة ترتيب باستخدام حروف انجليزية بحروف كبيرة هكذا ,,

ولن اقوم بسرد الاكواد الخاصة بها قم بالتجربة بنفسك واطرح النتيجة فى الموضوع وساقوم بالمتابعة والتصحيح ,, -:)

ولن ننسى القوائم الغير متسلسلة Unordered Lists فهناك اشكال عديدة لتغيير تلك النقطة السوداء باستخدام الخاصية TYPE وبعض القيم ايضا ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
حيث ان
يعنى مربع ويظهر بهذا الشكل ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
وتعنى دائرة مفرغة وتظهر بهذا الشكل ,,

ولن اقوم بسرد الاكواد الخاصة بها قم بالتجربة بنفسك واطرح النتيجة فى الموضوع وساقوم بالمتابعة والتصحيح ,, -:)

الى هنا اكون قد انتهيت من درس القوائم

وفى النهاية
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
هذا عمل بشري ,, لا يخلوا من الأخطاء , فإن أصبت فمن الله .. وإن أخطأت فمني ومن الشيطان .
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
وعند النقل يرجى ذكر المصدر
دمتم بود
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**

|