#1
| ||||||||||||||
| ||||||||||||||
Html الفقرات مفهوم الفقرات الفقرة ( Paragraph ) عبارة عن مساحة يتم تخصيصها لعرض النص الذي نضعه فيها على سطر جديد. أنواع الفقرات هناك نوعين من الفقرات التي يمكن إضافتها في الصفحة:
الفقرات المخصصة لعرض النص بالشكل المناسب لعرض نص عادي في الصفحة نضع النص بداخل <p></p>. معلومة: p إختصار لكلمة Paragraph التي تعني فقرة. عند عرض النص بواسطة هذا الوسم يقوم المتصفح بإزالة أي مسافات فارغة يجد أنه لا داعي لها ( Extra White Spaces ) على النحو التالي:
في المثال التالي قمنا بعرض فقرتين في الصفحة. عند تجربة الكود لاحظ كيف أنه سيتم عرض الفقرتين تحت بعضهما في الصفحة. المثال الأول
جرب الكود في المثال التالي تعمدنا وضع مسافات فارغة بين الكلمات. عند تجربة الكود لاحظ كيف سيقوم المتصفح بإزالة جميع المسافات التي يجد أنه لا داعي لها و كيف سيعرف النص بشكل جميل. المثال الثاني
جرب الكود في المثال التالي تعمدنا كتابة النص على أكثر من سطر. عند تجربة الكود لاحظ كيف سيقوم المتصفح بعرض النص كله على سطر واحد متجاهلاً أن النص مكتوب على أكثر من سطر. المثال الثالث
جرب الكود النزول على سطر جديد في الفقرة لإعلام المتصفح أنك تريد النزول على سطر جديد بداخل الفقرة, يجب وضع <br> في نهاية السطر. معلومة: br إختصار لكلمة Break التي يقصد بها في حالتنا إيقاف العرض على نفس السطر. في المثال التالي قمنا بإعلام المتصفح أنه من بعد كلمة paragraph. يجب عرض النص المتبقي على سطر جديد. مثال
جرب الكود عرض أكثر من مسافة بين الكلمات في الفقرة لإعلام المتصفح أنك تريد وضع أكثر من مسافة فارغة وراء بعض في النص, فالحل هو استخدام الرمز الذي يعني مسافة فارغة بالنسبة للمتصفح. كل رمز تضعه يفهمه المتصفح على أنه مسافة فارغة يجب عدم إزالتها. في المثال التالي قمنا بإضافة 4 مسافات فارغة في بداية النص. مثال <p> We add 4 white spaces at the beginning.</p> جرب الكود الفقرات المخصصة لعرض النص كما هو لعرض النص كما يظهر بالضبط في الكود نضع النص بداخل <pre></pre>. معلومة: pre إختصار لعبارة Preformatted Text التي تعني نص منسق مسبقاً. مبدئياً النص الوحيد الذي نعرضه كما هو في العادة هو حين نعرض كود في صفحة الويب لأننا نريده أن يظهر بنفس الشكل الذي تم إدخاله فيه. في المثال التالي قمنا بكتابة نص بداخل <pre></pre> حتى يتم عرضه كما هو في المتصفح. مثال
جرب الكود طريقة عرض كود HTML في الصفحة الشيء الوحيد الذي عليك التفكير فيه هو أنه يجب جعل المتصفح يعتبر الكود الذي كتبته نص عادي حتى لا يقرؤه ككود عادي و يعرض نتيجته في الصفحة. لجعل المتصفح يعتبر الكود المكتوب كأحرف عادية فهناك شيئان يضمنا ذلك:
في المثال التالي قمنا بعرض كود HTML في الصفحة من خلال تبديل كل < موجود في الكود إلى <. ملاحظة: وضعنا الكود بداخل <pre></pre> حتى يتم عرضه بنفس الشكل الذي وضعناه فيه. مثال <pre> <!DOCTYPE html> <html> <body> <p>HTML & CSS are so easy to learn</p> </body> </html> </pre> جرب الكود طريقة عرض خط أفقي لعرض خط أفقي في الصفحة نضع <hr> فقط. معلومة: hr إختصار لكلمة Horizontal Rule التي تعني مسطرة أفقية. في المثال التالي قمنا بعرض خط أفقي بين الفقرتين. مثال
جرب الكود م.ق |
مواقع النشر (المفضلة) |
(مشاهدة الكل) عدد الذين شاهدوا هذا الموضوع : 1 : | |
|
|
المواضيع المتشابهه | ||||
الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
Html أساسيات اللغة | إسمهان الجادوي | تعليم لغة HTML | 0 | 11-07-2020 02:33 PM |
Html المحررات | إسمهان الجادوي | تعليم لغة HTML | 0 | 11-07-2020 02:29 PM |
نظرة عامة على اللغة html | إسمهان الجادوي | تعليم لغة HTML | 0 | 11-07-2020 02:22 PM |