بعض الوظائف لا تعمل على هذا المتصفح، حاول استخدام متصفح آخر
About Privacy Terms
بسم الله الرحمن الرحيم
شاركـ أصدقائك

كورس HTML | شرح خصائص html 日 2021 日

الرئيسية / الحاسب الآلي / لغات البرمجة / HTML / كورس HTML | شرح خصائص html

 

شرح html للمبتدئين

 

خصائص HTML

  • يمكن أن تحتوي كل عناصر HTML على خصائص.
  • توفر الخصائص معلومات إضافية حول العناصر.
  • يتم تحديد الخصائص دائمًا في علامة البدء.
  • تأتي الخصائص او السمات عادة في أسماء/قيم مثل: "name="value.

 

خصائص href

تحدد العلامة <a> ارتباطًا تشعبيًا. تحدد سمة href عنوان URL للصفحة التي ينتقل إليها الارتباط.

مثال:

<a href="https://www.folderat.com">Visit folderat</a> 

 

خصائص src

يتم استخدام علامة <img> لتضمين صورة في صفحة HTML. تحدد خاصية src المسار إلى الصورة المطلوب عرضها.

مثال:

<img src="img_rose.jpg">

هناك طريقتان لتحديد URL في خاصية src:

1.عنوان URL المطلق - روابط إلى الصورة الخارجية مستضافة على موقع ويب آخر.مثال:

src="https://www.folderat.com/images/img_rose.jpg".

ملاحظات: قد تكون الصور الخارجية خاضعة لحقوق النشر. إذا لم تحصل على إذن باستخدامه، فقد تكون مخالفًا لقوانين حقوق النشر. بالإضافة إلى ذلك، لا يمكنك التحكم في الصور الخارجية؛ يمكن إزالتها أو تغييرها فجأة.

2.عنوان URL النسبي - روابط إلى صورة مستضافة داخل موقع الويب. هنا ، لا يتضمن عنوان URL اسم المجال. إذا بدأ عنوان URL بدون شرطة مائلة ، فسيكون متعلقًا بالصفحة الحالية. مثال: src="img_rose".jpg

إذا بدأ عنوان URL بشرطة مائلة ، فسيكون مرتبطًا بالمجال.مثال: src="/images/img_rose".jpg

نصيحة: من الأفضل دائمًا استخدام عناوين URL النسبية. لن ينقطع إذا قمت بتغيير المجال.

 

خصائص العرض و الأرتفاع

يجب أن تحتوي علامة <img> أيضًا على سمات width و height، التي تحدد عرض الصورة وارتفاعها (بالبكسل):

مثال:

<img src="img_rose.jpg" width="400" height="500">

 

خصائص alt

تحدد السمة alt المطلوبة لوضع علامة <img> نصًا بديلاً للصورة، إذا تعذر عرض الصورة لسبب ما. قد يكون ذلك بسبب بطء الاتصال، أو خطأ في خاصية src، أو إذا كان المستخدم يستخدم قارئ شاشة.

مثال:

<img src="img_rose.jpg" alt="rose is red">

مثال
انظر ما يحدث إذا حاولنا عرض صورة غير موجودة:

<img src="img_typo.jpg" alt="rose is red">

 

خصائص style

يتم استخدام خاصية style لإضافة أنماط إلى عنصر، مثل اللون والخط والحجم والمزيد.

مثال:

<p style="color:blue;">This is a blue paragraph.</p>

 

خصائص lang

يجب أن تقوم دائمًا بتضمين خاصية lang داخل علامة <html>، لإعلان لغة صفحة ويب. هذا الغرض لمساعدة محركات البحث والمستعرضات.

يحدد المثال التالي اللغة الإنجليزية كلغة:

<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>

يمكن أيضًا إضافة رموز البلد إلى رمز اللغة في سمة lang. لذلك، يقوم أول حرفين بتعريف لغة صفحة HTML، ويحدد آخر حرفين البلد.

يحدد المثال التالي اللغة الإنجليزية كلغة، بينما تحدد الولايات المتحدة الأمريكية الدولة:

<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>

 

خصائص title

تحدد خاصية title بعض المعلومات الإضافية حول عنصر ما.

سيتم عرض قيمة سمة العنوان كتلميح أداة عند تمرير الماوس فوق العنصر

مثال:

<p title="I'm a tooltip">This is a paragraph.</p>

لا تنسى مشاركة الصفحة ومن صالح دعائكم

صورة
JAVASCRIPT
كورس JavaScript | شرح Where To

في HTML ، يتم إدراج كود JavaScript بين علامتي script. وظائف وأحداث JavaScript: وظيفة JavaScript هي كتلة من تعليمات JavaScript البرمجية. على سبيل المثال ، يمكن استدعاء ...

صورة
الطرح للصف الأول
الطرح

خصائص عملية الطرح : يمكن تحويل أي مسألة طرح إلى مسألة جمع والعكس صحيح. طرح 0 من أي رقم يعطي الرقم نفسه. عندما يتم طرح 1 من أي رقم ، فإن الفرق يساوي سلف الرقم. ...

صورة
أقوال عن الحياة
أقوال عن دروس الحياة

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

صورة
CSS
كورس CSS | مقدمة css

ما هي CSS؟ تُعد Cascading Style Sheets ، التي يشار إليها باعتزاز باسم CSS ، لغة تصميم بسيطة تهدف إلى تبسيط عملية جعل صفحات الويب قابلة للتقديم. يتعامل CSS مع الشكل وا ...

صورة
SQL
كورس SQL | مقدمة SQL

ما هي SQL؟ SQL هي اللغة القياسية للتعامل مع قواعد البيانات العلائقية. يمكن استخدام SQL لإدراج سجلات قاعدة البيانات والبحث عنها وتحديثها وحذفها. يمكن لـ SQL إجراء الكث ...

صورة
JAVASCRIPT
كورس JavaScript | مقدمة جافا سكريبت

ما هو JavaScript؟ JavaScript هي لغة برمجة كمبيوتر ديناميكية. إنه خفيف الوزن وأكثر استخدامًا كجزء من صفحات الويب ، حيث تسمح تطبيقاته للبرنامج النصي من جانب العميل بالت ...