تنسيق الاسطر html

17-03-2009, 09:43 PM

كما قلنا في مبادئ HTML أن الوسمان <BR> و <P> يجعلان المستعرض يبدأ سطراً جديداً. وقد بينا الفرق بينهما. ولكن الوسم <P> له عدة سمات. فبإمكانك أن تجعل الفقرة على اليمين وفي الوسط وعلى اليسار. وذلك باستخدام السمة ALIGN.كما يمكنك أن تجعل النص في الوسط باستخدام الوسم <CENTER>. لنجري هذا الإختبار لنتعرف على كلا الوسمين أكثر:-

<HTMLalt=rtl>
<HEAD>
<TITLE>إختبار تنسيق فقرة</TITLE>
<BODY>
<PALIGN="right">هذا الفقرة على يمين الصفحة.</P>
<PALIGN="center">هذه الفقرة في منتصف الصفحة.</P>
<PALIGN="left">هذه الفقرة على يسار الصفحة.</P>
<CENTER>هذا النص في الوسط أيضاً ولكن بوسم آخر</CENTER>
</BODY>
</HTML>

سيكون الناتج ما يلي:-

هذه الفقرة على يمين الصفحة.

هذه الفقرة في منتصف الصفحة.

هذه الفقرة على يسار الصفحة.

هذا النص في الوسط أيضاً ولكن بوسم آخر

لنبدأ الآن التكلم عن وسم آخر. ألا وهو وسم الخط الأفقي<HR> الذي ينشئ خطاً أفقياً على عرض الصفحة. أنظر إلى هذا الخط ..
تستطيع أن تضع الخط أعلاه بمجرد كتابة الوسم <HR> . دعنا الآن نغير خصائص هذا الخط. همممم ... لنعمل على توسيع عرض هذا الخط بنسبة 8 بكسل. ولتوسيعه أكتب الأمر التالي:-
<HRSIZE="8">
سيكون الناتج كالأتي:
ولكن لونه خافت. لنلونه بلون آخر. مثلاً بالأحمر. أكتب الأمر التالي:-
<HRSIZE="8"COLOR="red">
سيكون الناتج كالأتي:
أن لون الخط لم يتغير لماذا؟. إذا لم يتغير لون الخط.. فهذا يعني أنك تستعمل مستعرض Netscape.لأن نتسكايب لا يغير لون الخط الأفقي.
عظيم.. ولكن هذا الخط يبدو كبيراً. أريد أن أصغر حجمه بحيث يأخذ 50% من الصفحة. أكتب الأمر الآتي:-
<HRSIZE="8"COLOR="red"WIDTH="50%">
سيكون الناتج كالآتي:-
أريده أن يكون على جهة اليمين . أكتب الأمر الآتي :-
<HRSIZE="8"COLOR="red" WIDTH="50%" ALIGN="right">
سيكون الناتج كالآتي:-
الآن يمكنك أن تغير كل مواصفات هذا الخط ولا أعتقد أنك بحاجة إلى أمثلة أكثر .. صح؟
لنأتي إلى وسوم أخرى. الوسوم <H1> , <H2> , <H3>, <H4>, <H5>, <H6>. هذه الوسوم تجعل النص عريضاً وكبيراً حسب الرقم. وكلما كان الرقم أصغر كلما كان النص أكبر.ووظيفته كوظيفة عناوين الصحف Heading.. لنجري هذا الإختبار:-

<HTMLalt=rtl>
<HEAD>
<TITLE>إختبار</TITLE>
</HEAD>
<BODY>
<H1>النمط الأول
<H2>النمط الثاني
<H3>النمط الثالث
<H4>النمط الرابع
<H5>النمط الخامس
<H6>النمط السادس
</BODY>
</HTML>

سيكون الناتج ما يلي:-

النمط الأول

النمط الثاني

النمط الثالث

النمط الرابع

النمط الخامس

النمط السادس

أعتقد أنك فهمت ما تعنيه تلك الوسوم. فالمثال واضح جداً. لنذهب لزيارة وسم آخر.. الوسم <UL>. وهو وسم تشييد اللوائح... أنا لم أفهم ماذا تقصد بتشييد اللوائح! هل هي ألواح خشبية؟! حسناً.. لنجري هذا الإختبار للتعرف عليه. ولا تخف فهو من النوع الذي لا يعض.

<HTMLalt=rtl>
<HEAD>
<TITLE>تشييد اللوائح</TITLE>
</HEAD>
<BODY>
<UL>
<LI>اللائحة الأولى
<LI>اللائحة الثانية
<UL>
<LI>اللائحة الأولى من اللائحة الثانية
<LI>اللائحة الثانية من اللائحة الثانية
</UL>
<LI>اللائحة الثالثة
</UL>
</BODY>
</HTML>

الناتج كالتالي :-

اللائحة الأولى
اللائحة الثانية
- اللائحة الأولى من اللائحة الثانية
- اللائحة الثانية من اللائحة الثانية
اللائحة الثالثة

هل عرفت الآن معنى اللوائح؟ لاحظ أنك بعد أن تكتب الوسم <UL> لابد أن تفتح وسم <LI> ثم نص اللائحة. وإذا أردت أن تفتح لائحة داخل لائحة لابد أن تكتب الوسم <UL> مرة أخرى ثم وسم <LI> وبعد ذلك نص اللائحة. وإذا أردت غلق اللائحة أكتب الوسم <UL/>.أوه .. أعتقد أن مخك ومخي قد تصدعا من كلمة لائحة. لنشرب فنجان قهوة.
أنت تشرب قهوتك على مهل.. حسناً سأتحدث عن الجداول بينما أنت تشرب قهوتك. الجداول تساعدك في تنظيم وترتيب وتنسيق النصوص والقواعد. هل تستخدم مايكروسوفت وورد؟ هل استخدمت الجداول فيه؟ يمكنك تنسيق الجداول في إنترنت كتنسيق الجداول في وورد أو إكسل. والوسم الخاص بالجداول هو <TABLE>. وإذا أردت فتح صف أكتب الوسم <TR> إختصار Table Row أي صف الجدول. وكلما كتبت الوسم <TD> إختصارTable Data أي بيانات جدول يبدأ عمود جديد. أخيراً انتهيت من قهوتك. لنبدأ بمثال للجدول.

<HTMLdir=rtl>
<HEAD>
<TITLE>مثال للجداول</TITLE>
</HEAD>
<BODY>
<TABLEBORDER="1">
<TR>
<TD>الصف الأول العمود الأول
<TD>الصف الأول العمود الثاني
</TR>
<TR>
<TD>الصف الثاني العمود الأول
<TD>الصف الثاني العمود الثاني
</TR>
</TABLE>
</BODY>
</HTML>

الناتج كالتالي :-

الصف الأول العمود الأول الصف الأول العمود الثاني الصف الثاني العمود الأول الصف الثاني العمود الثاني

إن السمة BORDER تجعل عرض إطار الجدول قيمته 1. يمكنك زيادة عرضه كيفما شئت. وإذا أردت إخفائه .. دع قيمته صفر.

22-03-2009, 04:37 PM

30-03-2009, 04:52 AM

مشكووووووووووور

وسلم الله يميينك

10-04-2009, 09:33 AM

تشكر عالطرح الطيب

ربي لا هااانك

24-04-2009, 07:50 PM

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

30-07-2009, 03:49 AM

مشكووووووووووور
ووووووووومااااااقصرت
شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية .

30-07-2009, 11:36 PM

يعطيك الف عافيه
تسلم مااتقصر متميز داايمآ
والف الف الف شكر اخي الكريم

02-08-2009, 06:37 PM

مشكور اخي ويعطيك الف عافيه
بانتضار المزيد
تح ـــيتــي

30-08-2009, 08:14 PM

الله يعطيك الف عااااااااااااااااااااااااااااافيه
ولك جزيل الشكر والتقدير على هذا الجهد الكبير
تقبل تحياااااااااااااااااتي

28-09-2009, 06:26 PM

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية
يالغالي

22-03-2009, 04:37 PM	#2
عضو مؤسس تاريخ التسجيل: 11 - 4 - 2008 الدولة: MALAYSIA المشاركات: 2,247 معدل تقييم المستوى: 80	رد: تنسيق الاسطر html __________________

30-03-2009, 04:52 AM	#3
:: عضوهـ مؤسسة :: تاريخ التسجيل: 20 - 7 - 2008 الدولة: مأجؤؤر يآآآقلـــبي المشاركات: 25,344 معدل تقييم المستوى: 3208	رد: تنسيق الاسطر html مشكووووووووووور وسلم الله يميينك __________________

10-04-2009, 09:33 AM	#4
مستشـارة المديـر العــام تاريخ التسجيل: 17 - 11 - 2008 الدولة: شمالأ جهــــة القلب .. المشاركات: 22,898 معدل تقييم المستوى: 5540	رد: تنسيق الاسطر html تشكر عالطرح الطيب ربي لا هااانك __________________ من عزتي يوم صار الكون " كله غريب ! وقفت رغم الجروح المدمية .. وآبتسمت .. يآ ليت كل النفوس : تجآزي الطيب / طيب ! آو ليتني قبل أبدا بـ بعض الأشياء .. سلمت .. مآ عآد للجرح : يآ عوج ألمحآني " طبيب ! من آكثر مآ آحسن ظني بـ البشر .. وآنصدمت ..

24-04-2009, 07:50 PM	#5
تاريخ التسجيل: 17 - 12 - 2008 الدولة: Dubai المشاركات: 3,031 معدل تقييم المستوى: 81	رد: تنسيق الاسطر html شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . __________________

30-07-2009, 03:49 AM	#6
تاريخ التسجيل: 29 - 6 - 2009 الدولة: ـقلـ صنعاء ــبـ المشاركات: 11,146 معدل تقييم المستوى: 208	رد: تنسيق الاسطر html مشكووووووووووور ووووووووومااااااقصرت شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . __________________ لتحميل بصمة منتديات اليمن اغلى

30-07-2009, 11:36 PM	#7
عضو متألق تاريخ التسجيل: 3 - 4 - 2009 الدولة: صنـ YEMEN ـ ع ـاء المشاركات: 11,656 معدل تقييم المستوى: 520	رد: تنسيق الاسطر html يعطيك الف عافيه تسلم مااتقصر متميز داايمآ والف الف الف شكر اخي الكريم __________________ يا ساحر البشر هذا تصميم ساحر البشر لمسابقه احلى وطن ...

02-08-2009, 06:37 PM	#8
.: عضو متميــز :. تاريخ التسجيل: 28 - 6 - 2009 المشاركات: 2,679 معدل تقييم المستوى: 77	رد: تنسيق الاسطر html مشكور اخي ويعطيك الف عافيه بانتضار المزيد تح ـــيتــي __________________

30-08-2009, 08:14 PM	#9
.:: عقيــــد ::. تاريخ التسجيل: 6 - 6 - 2009 الدولة: الامارات المشاركات: 6,998 معدل تقييم المستوى: 103	رد: تنسيق الاسطر html الله يعطيك الف عااااااااااااااااااااااااااااافيه ولك جزيل الشكر والتقدير على هذا الجهد الكبير تقبل تحياااااااااااااااااتي __________________ There is no difference between a wise man and a fool when they fall in love. لافرق بين رجل حكيم واحمق عندما يقعون في الحب

28-09-2009, 06:26 PM	#10
::: مـــشير ::: تاريخ التسجيل: 29 - 6 - 2009 المشاركات: 14,052 معدل تقييم المستوى: 134	رد: تنسيق الاسطر html شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية يالغالي __________________ تشلسي عشقي وذوقي ... تشلسي دم بعروقي اهداف دروجبا إيسيان