الرئيسية / المدونة / تصميم وبرمجة المواقع / العلامات الأساسية لــ (HTML)

العلامات الأساسية لــ (HTML)

17 يوليو، 2023 * تيتو 4 تك

يبدأ أي مستند بعنوان معين ويمكنك استخدام أحجام مختلفة لعناوينك حيث يحتوي HTML أيضًا على ستة مستويات من العناوين ، والتي تستخدم العناصر <h1> و <h2> و <h3> و <h4> و <h5> و <h6>. أثناء عرض أي عنوان ، يضيف المتصفح سطرًا واحدًا قبل ذلك العنوان وسطرًا بعده. ومثال علي ذلك :


 
<!DOCTYPE html>
<html>
  <head>  
      <title>Title examples</title>    
   </head>  
      <body>  
      <h1>This is Heading 1</h1>    
      <h2>This is Heading 2</h2>    
      <h3>This is Heading 3</h3>    
      <h4>This is Heading 4</h4>    
      <h5>This is Heading 5</h5>    
      <h6>This is Heading 6</h6>    
   </body>  
    </html>

 

سيؤدي هذا إلى النتيجة التالية :

 

This is Heading 1

This is Heading 2

This is Heading 3

This is Heading 4

This is Heading 5
This is Heading 6
 

علامة الفقرات

توفر العلامة <p> طريقة لبناء النص في فقرات مختلفة. يجب إدخال كل فقرة من النص بين علامة الافتتاح <p> وعلامة الإغلاق </p> كما هو موضح أدناه في المثال :

 

<!DOCTYPE html>
<html>
<head> 
      <title>Paragraph examples</title>   
   </head> 
   <body> 
      <p>This is the First paragraph of the text</p>   
      <p>This is the Second paragraph of the text</p>   
      <p>This is the Third paragraph of the text</p>   
   </body> 
</html>

 

سيؤدي هذا إلى النتيجة التالية :

 

This is the first paragraph of the text

This is the Second paragraph of the text

This is the Third paragraph of the text

 

علامة سطر فاصل

عندما تستخدم عنصر </ br> ، فإن أي شيء يتبعه يبدأ من السطر التالي. هذه العلامة هي مثال لعنصر فارغ ، حيث لا تحتاج إلى فتح وإغلاق علامات ، حيث لا يوجد شيء بينهما.

تحتوي العلامة </ br> على مسافة بين الحرفين br والشرطة المائلة للأمام. إذا حذفت هذه المساحة ، فستواجه المتصفحات القديمة مشكلة في عرض فاصل الأسطر ، بينما إذا فاتتك حرف الخط المائل للأمام واستخدمت <br> فقط ، فلن يكون صالحًا في XHTML.


 
<!DOCTYPE html>
<html>
<head> 
      <title>Example of separator line</title>   
   </head> 
   <body> 
          <p> Welcome <br />    
             You deliver your assignment on time <br /> 
              Thanks <br />
          Tito 4 Tech </p>    
   </body> 
</html>

 

سيؤدي هذا إلى النتيجة التالية :

 

Welcome
You deliver your assignment on time
Thanks
Tito 4 Tech

 

توسيط المحتوى

يمكنك استخدام علامة <center> لوضع أي محتوى في وسط الصفحة أو أي خلية جدول.

 

<!DOCTYPE html>
<html>
<head> 
      <title>An example of content centering</title>   
   </head> 
   <body> 
      <p>This text is not in the middle</p>   
 <center>         
<p>This text is in the middle</p>            
<center/>         
   </body> 
</html>

 

سيؤدي هذا إلى النتيجة التالية :

 

This text is not in the middle
                                        This text is in the middle

 

الخطوط الأفقية

تُستخدم الخطوط الأفقية لتقسيم أقسام المستند بصريًا. تنشئ العلامة <hr> سطرًا من الموضع الحالي في المستند إلى الهامش الأيمن وتكسر السطر وفقًا لذلك.

على سبيل المثال ، قد ترغب في كتابة سطر بين فقرتين كما في المثال التالي :

 

<!DOCTYPE html>
<html>
<head> 
      <title>Example of separator line</title>   
   </head> 
   <body> 
<p>This is the first paragraph and should be at the top</p>                  
         <hr />
         <p>This is the second paragraph and should be at the bottom</p>        
    </body> 
  </html>

 

سيؤدي هذا إلى النتيجة التالية :

 

This is the first paragraph and should be at the top

This is the second paragraph and should be at the bottom

 

مرة أخرى ، تعد العلامة </ hr> مثالاً للعنصر الفارغ ، حيث لا تحتاج إلى علامات الفتح والإغلاق ، حيث لا يوجد شيء بينهما.

يحتوي العنصر </ hr> على مسافة بين الأحرف hr والشرطة المائلة للأمام. إذا حذفت هذه المساحة ، فستواجه المتصفحات القديمة مشكلة في عرض الخط الأفقي ، بينما إذا فاتتك حرف الخط المائل للأمام واستخدمت فقط <hr> فهو غير صالح في XHTML.

التسميات

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