الفصل التاسع:النصوص العناوين

الفصل التاسع:النصوص العناوين

(العناوين وحجمها وخواصها | النصوص وخواصها )

إن تنسيق الخطوط واختيار الالوان من اهم عمل مصممي مواقع الويب لأنه يكون السبب في جلب زوار لموقعك فإذا وجد الزار تناسق بين الالوان والصور والنصوص فلا يتردد بزيارة موقعك مره اخري اما إذا لم يجد
ذلك فلا يتردد في مغادرة موقعك في الحال..

العناوين وحجمها وخواصها

عنوان موقعك والعناوين بشكل عام هي اول ما يراه الزائر لذلك يجب عليك الاهتمام بتنسيق العناوين ...اعرف ان احجام العناوين هي 6 احجام اكبرها يأخذ القيمه 1 ويكتب بالوسم<h1>  واصغرها يأخذ القيمه6 ويكتب<h6>وحرف h هو اختصار لكلمةheading

الان لنتعلم وضع عنوان في الصفحه هذا المثال به كل الاحجام الرئيسيه 

لنري النتيجه

 

ها قد نجحنا في كتابة اول عنوان لنا في القرص

لكن دعنا نتحدث عن النصوص بصفه عامه وكل ما يقال علي النصوص سيتم تطبيقه علي العناوين

النصوص وخواصها

لنكتب أي نص ونقوم بتنسيقه لابد وان تستخدم هذا الوسم<font> اعتقد اسمه يوضح معناه لكن دعنا الان نقوم بتغير حجم خط فقره معينه

<font size="6">simple text</font>

فلتجرب هذا وتري النتيجه ولكن لاحظ ان الخط الاساسي يكون دائما3 ومسموح لك بأستخدام الخط من 1الي7لكن إذا اردت ان يكون الخط اكبر من ذلك او اصغر استخدم الطريقه النسبيه وهي من -3الي+5 وذلك يتم تكبير الخط نسبة الي الموضع الموجود به ..جرب ذلك..

الان بنقم بتغير نوع الخط وسوف نستخدم الوسم<font face>

اليك مثال عملي لكي تفهم اكثر

<font face="courier">text page</font>

تذكر انه يمكنك استخدام الخطوط المشهوره حتي تكون متوفره علي جهاز الزائر وهذه اشهر الخطوط

Arial,helvetica,sans-serif,verdana,geneva,sans-serif,time new roman,times,serif

لننتقل الي تغير لون الخط سنستخدم هذا الوسم

<font color>

أأكد عليك ضرورة اختيار الالوان المناسبه لنأخذ المثال

<font color="red">text color </font>

يمكنك الرجوع الي الفصل الثامن لتستخدم اكواد الالوان مكان اسم اللون

لكن ماذا إن اردنا تغير حجم ولون ونوع الخط؟؟؟؟؟؟؟؟؟؟؟لا لن تكتب في كل خاصيه كود فقط هو كود واحد فقط انظر معي:

<font face="time new roman" color="ff9900" size="5">you see or not</font>

لنري ايضا امكانية جعل الخط اسود عريض او مائل او تحته خط وهذه ليست جديده بل مرت علينا من قبل

<font face="time new roman" color="ff9900" size="5"><u><i><b>you see or not</b></i></u></font>

الان قم بتطبيق ما تعلمته في هذا الفصل علي العناوين؟ هل ستنجح!!!

قبل ان ننتقل الي الفصل التالي دعنا نري الفقرات

الوسم الخاص بالفقرات يكون<p> هذا الوسم لابد وان يغلق حتي يتم تتطبيق التنسيق علي الفقره  فقط وليس علي النص بالكامل لنري

<p>Welcome To My Paragraph</p>

لنضيف التأثيرalign وسيأخذ احد ثلاثة قيم left , center,right

<p align="right">welcome</p>

رأيت الان التأثير إذا لقد نجحنا

لكن هل رأيت يوم في احد المواقع كلمة انتقل الي اعلي الصفحه او الي اسفل الصفحه؟؟؟؟؟؟  نعم نراها كثيرا لكن كيف تكتب؟؟!!!

نفذ وافهم هذا الوسم جيد اولا نحدد اسم للفقره وسيكون ذلك بأستخدام وسم الارتباط التشعبي (الوصلات) سنجعل هذا الكود في بداية الصفحه

<a name="top"></a>

 لاحظ انه يمكنك تسميتها بأي اسم غير top لكن لابد من تذكره بعد ان تقوم بأدراج هذا الوسم قم بكتابة ماتريد لتملئ الصفحه ثم في النهايه علينا وضع رابط لكي يقوم بالقفز الي بداية الصفحه

ضع هذا الوسم في نهاية الصفحه

<a href="#top">go to top</a> اعتقد انك فهمت الوسم؟ الان يمكنك القفز الي مكان في الصفحه بأستخدام تلك الوسم تستطيع وضعها في أي مكان في الصفحه...

انتهينا من هذا الدرس لنلتقي في الدرس التالي إن شاء الله......