في تصنيف مناهج تعليمية بواسطة

جميع أكواد html من الوسومhtml>  الخاصة بلغة الاتش تى ام ال وكل وسم امامه وظيفته الخاصة به الى جانب امثلة مع الشرح اساسيات html

لغة البرمجة 

جميع أكواد html مع الشرح

كود html جاهز

CSS

W3Schools

W3school HTML

[الصف الثاني]

((الدرس الاول))

مرحباً بكم متابعينا الأعزاء طلاب وطالبات العلم  في موقعنا النورس العربي منبع المعلومات والحلول الذي يقدم لكم أفضل الأسئله بإجابتها الصحيحه من شتى المجالات التعلمية من مقرر المناهج التعليمية  والثقافية ويسعدنا أن نقدم لكم حل السؤال الذي يقول........ جميع أكواد html من الوسومhtml> الخاصة بلغة الاتش تى ام ال وكل وسم امامه وظيفته الخاصة به الى جانب امثلة مع الشرح اساسيات html

الإجابة هي كالتالي 

نقدم لكم مجموعة كبيرة من الوسوم الخاصة بلغة الاتش تى ام ال وكل وسم امامه وظيفته الخاصة به الى جانب امثلة على بعض الوسوم التى تحتاج لامثلة يمكنك تجربتها كما تعلمت فى الدرس الخاص باساسيات html

اساسيات لابد ان تعرفها لتعلم لغة html

لا تنسى كتابة وسم البداية والنهاية 

<html> ...... </html>

وتضع الكود الذى تريد تجربته بينهما

الوسم وظيفة الوسم

مجموعة من اهم وسوم لغة الاتش تى ام ال 

<-! ... -> هذا الوسم عبارة تعليق وليس له اى نتيجة على المستعرض ولكن يمكنك كتابة ارشادات به لمن يريد التعديل على الكود

<! DOCTYPE> هذا الوسم يحدد نوع المستند

<html> وسم بداية ملف الاتش تى ام ال لابد ان تبدا به اى صفحة اتش تى ام ال

<head> هو وسم خاص برأس الصفحة ويحتوى على عنوان الموقع الذى يظهر فى تبويب الموقع

<body> هذا الوسم يحتوى على جميع محتويات الموقع لديك كما ذكرنا ان الموقع يتكون من راس وجسم لذا فهذا الوسم هو جسم الموقع وبه كل محتوياته

<title> <head> هذا الوسم خاص بعنوان الموقع والذى يظهر فى التبويب بالمتصفح ويوضع هذا الوسم داخل الوسم

<A> وسم اضافة ارتباط تشعبى

<a href="http://www.facebook.com">تفضل بزيارة رعد نت !</a>

<article> وسم خاص بالمقالات

<b> وسم لجعل الكتابة سمكية

<b>facebook </b>

<br> وسم بداية سطر جديد

<u> وسم لوضع خط تحت الكتابة

<i> وسم لجعل الكتابة مائلة

<i>facebook</i>

<button> وسم اضافة زر

<button type="button" onclick="alert('اهلا وسهلا!')">اضغط هنا!</button>

<h1> to <h6> هو وسم العنوان الرئيسى<h1></h1>اى ان الوسم

هو وسم العنوان الفرعى الاول وهكذا <h2></h2> والوسم

<img> وسم وضع صورة ويمكن استخدامه بهذا الشكل

<img src="facebook.gif" alt="facebook" height="34" width="32">

<input> من الوسوم الهامة جدا وهو لعمل استمارات التسجيل مثل مثلا الاسم الاول وتجد مربع لكتابة الاسم الاول وهكذا

وله عدة انواع نوع تكست وهو للكتابة ونوع سبميت وهو زر الموافقة او الانهاء

<form action="database.asp">

First name: <input type="text" name="FirstName" value="your first name"><br>

Last name: <input type="text" name="LastName" value="your last name"><br>

<input type="submit" value="Submit">

</form>

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

<iframe> هذا الوسم يقوم بعمل فريم او اطار حول صورة او موقع كما تحدد انت من خلال الرابط الذى تضعه فى الكود

<iframe src="http://www.facebook.com">

  <p>Your browser does not support iframes.</p>

</iframe>

<center> وسم لجعل النص فى وسط الصفحة او المحاذاة فى الوسط

<center> facebook.com </center>

<base> هذا الوسم يكتب فى الهيد فى كود الاتش تى ام ال وهو يحدد رابط ثابت لجميع الروابط فى الصفحة بمعنى اننا كتبنا هذا الكود على سبيل المثال فى الهيد

<head>

<base href="http://www.facebook.com" target="_blank">

</head>

body ثم اذا اردنا ان نضع اى رابط فى

يكون مثلا بهذا الشكل

<body>

 <a href="2012/11/htmltags.html">html tags</a>

</body>

فنحن لم نكتب الرابط كامل اى اننا كتبنا بقية الرابط بعد دومين الموقع

<abbr> هذا الوسم يمكنك من اظهار تعليق عند الوقوع بالماوس على كلمة او صورة معينة

<p>موقع <abbr title="اهلا وسهلا بك فى موقع رعد نت">رعد نت</abbr> لتطوير المواقع والمنديات</p>

 <abbr title="www.facebook.com">my website</abbr>

<bdo> هذا الوسم يقوم بعملية قلب الحروف من اليمين الى اليسار او العكس

<p><bdo dir="rtl">facebook right-to-left.</bdo></p> يقرأ النص من اليمين الى الشمال

<p><bdo dir="ltr">facebook right-to-left.</bdo></p> يقرأ النص من الشمال الى اليمين

<table> وسم عمل جدول

<table border="1">

  <tr>

    <th>اسم الموقع</th>

    <th>اللينك</th>

  </tr>

  <tr>

    <td>رعد نت</td>

    <td>www.facebook.com</td>

  </tr>

 </table>

<tr> وسم الصفوف فى الجدول

<th> وسم الخلايا الرئيسية فى الجدول الموجودة فى راس الجدول

<td> وسم الخلايا فى الجدول

<tbody> cssيستخدم لتنسيق جسم الجدول ( لا يعمل الا مع  

tbody {color:blue;}

<thead> cssيستخدم لتنسيق رأس الجدول( لا يعمل الا مع 

thead {color:green;}

<tfoot> cssيستخدم لتنسيق اسفل الجدول( لا يعمل الا مع 

 <html>

<head>

<style type="text/css">

thead {color:green;}

tbody {color:blue;}

tfoot {color:red;}

</style>

</head>

<body>

<table border="1">

  <tr>

    <th>اسم الموقع</th>

    <th>اللينك</th>

  </tr>

  <tr>

    <td>فيسبوك</td>

    <td>www.facebook.com</td>

  </tr>

 </table>

</body>

</html>

<caption> وسم عمل عنوان للجدول

<table border="1">

  <caption>عنوان الجدول</caption>

  <tr>

    <th>اسم الموقع</th>

    <th>اللينك</th>

  </tr>

  <tr>

    <td>فيسبوك</td>

    <td>www.facebook.com</td>

  </tr>

 </table>

<blockquote> 

هذا الوسم يستخدم لازاحة النص او عمل اقتباس

<dl> <dt>هذا الوسم لعمل مجموعة عناوين ولكل عنوان وصف ويستخدم للعنوان الوسم

 <dd>ويستخدم للوصف الوسم

 مثال

 <dl>

  <dt>html</dt>

  <dd>لغة هيكلة وتصميم المواقع</dd>

  <dt>php</dt>

  <dd>لغة تمكنك من برمجة السكربتات</dd>

</dl>

<del> وسم لشطب كلمة

<del>ra3dnet</del>

<ins> <del>وسم ادراج كلمة وغالبا ما يستخدم بعد الوسم

اى تشطب كلمة وتدرج مكانها اخرى بهذا الشكل

my website name is <del>facetook</del><ins>facebook</ins>

my website name is facetook

facebook

<em>

<strong>

<dfn>

<code>

<samp>

<kbd>

يتبع في الأسفل 

1 إجابة واحدة

0 تصويتات
بواسطة
 
أفضل إجابة
اساسيات html

<var> كل هذه الوسوم تمثل انماط من خطوط الكتابو المختلفة وكل وسم يعتبر

اختصار لنوع الخط وهى بالترتيب والشكل

Emphasized text

Strong text

Definition term

A piece of computer code

Sample output from a computer program

Keyboard input

Variable

<div> هذا الوسم يحدد نمط عام لكل ما يكتب فيه ، على سبيل المثال اذا اردنا ان نجعل كل الكتابة الموجودة فى منطقة معينة باللون الاحمر فنضعها داخل الوسم بهذا الشكل

<div style="color:#FF0000">

  <h3>www.facebook.com</h3>

  <p> لتطوير المواقعsiros school والمنتديات والمدونات</p>

</div>

css وهو يستخدم بشكل اشمل من ذلك مع اكواد

<fieldset> هذا الوسم لعمل حقل او استمارة كاستمارات التسجيل ، سيكون رائع عند تجربته ، قم بتجربة هذا الكود

<fieldset>

  <legend>التسجيل:</legend>

  الاسم: <input type="text"><br>

  الايميل: <input type="text"><br>

  تاريخ الميلاد: <input type="text">

 </fieldset>

 يكتب به اسم الحقل<legend> والوسم

<form> هذا الوسم يستخدم عند عمل حقول ادخل البيانات مثل السابقة ووظيفته ادخل اسم ملف قاعدة البيانات الذى ستتم تخزين البيانات المدخلة به

<form action="database.asp" method="get">

  الاسم الاول: <input type="text" name="الاسم الاول"><br>

الاسم الاخير : <input type="text" name="الاسم الاخير"><br>

  <input type="submit" value="Submit">

</form>

حيث يكون الملف

 على سبيل المثال هو قاعدة البيانات الموجودة على موقعك والتى سيتم تسجيل بيانات المسجلين بهاdatabase

<center> facebook.com </center>

<hr> وسم لوضع فاصل بين الفقرات والموضوعات فى موقعك

<label> هذا الوسم لعمل خيارات ويمكنك تجربته بهذا الكود

<form action="database.asp">

  <label for="male">Male</label>

  <input type="radio" name="sex" id="male" value="male"><br>

  <label for="female">Female</label>

  <input type="radio" name="sex" id="female" value="female"><br><br>

  <input type="submit" value="Submit">

</form>

<legend> ويستخدم لتسميته كما ذكرنا سابقا <filedset> هذا الوسم يستخدم مع وسم الحقل

<ol> وسم عمل قائمة تعداد رقمى

<ul> وسم عمل قائمة ذات تعداد نقطى

<li> وسم يستخدم مع الوسمين السابقين للفصل بين النقاط ونأخذ مثال للوسوم معا

<ol>

  <li>first</li>

  <li>second</li>

  <li>third</li>

</ol>

<ul>

  <li>first</li>

  <li>second</li>

  <li>third</li>

</ul>

<link> هذا الوسم يستخدم لربط ملف الاتش تى ام ال بملف اخر سى اس اس او لغة اخرى

<meta> <head> هذا الوسم خاص بمعلومات موقعك ويوضع داخل الجزء

ولا يظهر فى تنسيق الموقع ولكن يفيد محركات البحث ومثال الكود المستخدم مع الميتا

<head>

me="author" content="ra3dnet">

<meta cha<meta name="description" content="Free Web tutorials">

<meta name="keywords" content="HTML,CSS,XML,JavaScript">

<meta narset="UTF-8">

</head>

<script> لاضافة كود جافا سكربت

<noscript> لتحديد جملة ما تظهر اذا لم يتم عرض السكربت او اذا كان متصفح المستخدم لا يعمل به اسكربتات الجافا

مثال

<noscript>Your browser does not support JavaScript!</noscript>

<optgroup> هذا الوسم يستخدم لعمل قائمة خيارات وهو يعنى مجموعة الخيارات

ويستخدم مع الوسمين التاليين وسنعرض لهم مثالا معا

<option> هذا الوسم يحدد كل خيار من خيارات القائمة

<select> هذا الوسم يوضع ليجعل قائمة الخيارات عبارة عن قائمة منسدلة وهذا مثال

<select>

  <optgroup label="لغات البرمجة">

    <option value="html">html</option>

    <option value="java">java script</option>

  </optgroup>

  <optgroup label="التصميم">

    <option value="Photoshop">photoshop</option>

    <option value="flash">Flash</option>

  </optgroup>

</select>

<pre> هذا الوسم عند كتابة نص بداخله ستجده يظهر بحجم ثانبت ومسافات ثابته كما انه يفبل عمل المسافات باستخدام المسطرة وعمل الفواصل ( حيث انك لا تستطيع عمل مسافات فى الكتابة العادية )ومثال

<pre>

facebook net

</pre>

<q> هذا الوسم يستخدم لعمل علامات تنصيص حول الفقرة

<s> يستخدم هذا الوسم لشطب جملة او كلمة ما

facebook

<small> وسم لكتابة نص بحجم صغير

<span> يستخدم هذا الوسم لتنسيق كلمات فقط داخل فقرة كاملة مثل تغيير اللون او نوع الخط

<span style="color:blue;font-weight:bold">facebook</span>

وذلك اذا كان هناك تنسيق عام للفقرة كلها وتريد استثناء مقطع صغير او كلمة معينة

<sub> يستخدم لجعل الكلمة اسفل السطر

this word is subscript text

<sup> لجعل الكلمة اعلى السطر

This word is superscript text.

<textarea> هو وسم لعمل منطقة كتابة نص مع تحديد المساحة

<textarea rows="4" cols="50">facebook here </textarea>
...