شبكة المنصوره نت
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


المنصوره نت | اخبار | صور | دردشة | شات | Mb3 |فيديو | YouTube | برامج | خلفيات | العاب | نكت | قصص | Css | html | استايلات | فوتوشوب | كرة قدم | ادعية | اناشيد | منوعات | فلاشات
 
الرئيسيةأحدث الصورالتسجيلالبوابهالتسجيلدخولالمجله
دروس Html - الدرس السادس: المزيد من العناصر Fb1
تسجيل صفحاتك المفضلة في مواقع خارجية
تسجيل صفحاتك المفضلة في مواقع خارجية reddit      

قم بحفض و مشاطرة الرابط انت عمرى على موقع حفض الصفحات

قم بحفض و مشاطرة الرابط شبكة المنصوره نت على موقع حفض الصفحات

 

 دروس Html - الدرس السادس: المزيد من العناصر

اذهب الى الأسفل 
كاتب الموضوعرسالة
Aym@n

Aym@n


** عدد المساهمات ** 1586
نقاط 8129
المستوى المستوى : 6
تاريخ التسجيل : 29/05/2010
My MMS : دروس Html - الدرس السادس: المزيد من العناصر 4
:^~~~أوسمتى~~~^ :
دروس Html - الدرس السادس: المزيد من العناصر 13000955908


دروس Html - الدرس السادس: المزيد من العناصر Empty
مُساهمةموضوع: دروس Html - الدرس السادس: المزيد من العناصر   دروس Html - الدرس السادس: المزيد من العناصر Emptyالسبت يونيو 04, 2011 6:30 am

دروس Html - الدرس السادس: المزيد من العناصر 6_bmp14
الدرس السادس: المزيد من العناصر

هل قمت بإنشا المزيد من الصفحات بنفسك؟ إن لم تفعل فإليك هذا المثال:

الكود:

<html>

<head>
<title>My website</title>
 </head>

<body>
<h1>A Heading</h1>
<p>text, text text, text</p>
<h2>Subhead</h2>
<p>text, text text, text</p>
</body>
     
</html>


ما التالي؟

حان الوقت الآن لتعلم سبعة عناصر جديدة.

بنفس الطريقة التي تؤكد فيها على نص معين عندما تضعه بين وسم البداية <em> ووسم الإغلاق </em>, يمكنك أن تضيف تأكيداً أقوى باستخدام وسم البداية <strong> ووسم الإغلاق </strong>.

مثال 1:
<strong>This should be stronger emphasis.</strong>
سيظهر بهذا الشكل في المتصفح:
This should be stronger emphasis.

بطريقة مماثلة يمكنك تصغير النص باستخدام العنصر small:

مثال 2:
<small>This should be in small.</small>
سيظهر بهذا الشكل في متصفحك
This should be in small.


هل أستطيع استخدام عدة عناصر في نفس الوقت؟

بإمكانك استخدام عدة عناصرة بسهولة في نفس الوقت، لكن تجنب تداخل العناصر. يمكن توضيح ذلك بهذا المثال:

مثال 3:

إذا أردت التأكيد على نص صغير الحجم يجب أن تفعل ذلك بهذه الطريقة:
الكود:
<em><small>Emphasised small text</small></em>
وليس بهذه الطريقة:
الكود:
<em><small>Emphasise small text</em></small>



وجه الاختلاف في المثال الأول يكمن في أننا أغلقنا أولاً الوسم الذي قمنا بافتتاحه آخراً، بمعنى آخر وسم البداية الأول يغلق آخراً، هكذا لا نربك أنفسنا أو المتصفح.

المزيد من العناصر!

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

مثال 4:
الكود:
Some text<br /> and some more text in a new line
سيظهر بهذا الشكل في متصفحك
Some text
and some more text in a new line



لاحظ أن الوسم كتب بطريقة يختصر فيها وسم البداية ووسم الإغلاق بوضع مسافة وشرطة أمامية في نهايته: <br />.

عنصر آخر مشابه يحوي وسم البداية والإغلاق في نفس الوقت هو <hr /> الذي يستخدم في رسم خط أفقي، حرفي "hr" يعنيان "horizontal rule":

مثال 5:
الكود:
<hr />
:سيظهر بهذا الشكل في متصفحك
_____________________________________

هناك عناصر أخرى تحتاج إلى وسمي البداية والإغلاق - كما هو حال معظم العناصر - مثل ul وol وli. هذه العناصر تستخدم عندما تريد إنشاء القوائم.

ul هي اختصار "unordered list" وهو عنصر يقوم بوضع نقاط لكل بند في القائمة، أما ol فهي اختصار "ordered list" أو قائمة مرتبة فهو يضع رقماً لكل بند في القائمة، ولكي نضع البنود في القائمة علينا أن نستخدم الوسم li أو "list item"، هل أصبحت بالحيرة، شاهد هذا المثال:

مثال 7:
الكود:

<ul>
<li>A list item</li>
<li>Another list item</li>
</ul>

سيظهر بهذا الشكل في متصفحك

  • A list item
  • Another list item

مثال 8:
الكود:

<ol>
<li>First list item</li>
<li>Second list item</li>
</ol>


سيظهر بهذا الشكل في متصفحك

  1. First list item
  2. Second list item

هل هذا كل شيء؟

نعم هذا كل شيء، ومرة أخرى، قم بعمل تجارب بنفسك وجرب العناصر السبعة التي تعلمتها في هذا الدرس:

الكود:
<strong>Stronger emphasis</strong>
<small>Small text</small>
<br /> Line shift
<hr /> Horizontal line
<ul>List</ul>
<ol>Ordered list</ol>
<li>List item</li>
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://www.facebook.com/groups/140030819400564?ap=1 https://mns4.ahladalil.com
 
دروس Html - الدرس السادس: المزيد من العناصر
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» دروس Html الدرس الثالث: العناصر والوسوم
» دروس Html الدرس الثاني: ما هي HTML؟
» دروس Html الدرس الأول
» دروس Html - الدرس السابع: الخصائص
» دروس Html الدرس الرابع: إنشاء موقعك الأول

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
شبكة المنصوره نت :: اقسام الدعم والتقنيه Technical Support :: لغات البرمجة Programming languages :: اكواد لغة اتش تى ام ال Kompass language Html-
انتقل الى:  
اقسام المنتدى
القرأن الكريم
الخطب والدروس
صوراسلامية
الأدعية والاناشيد
اسلاميات عامة
حوار ونقاش
ترحيب وتهاني
أخبار المنصورة
توبيكات عامة
تهييس أون لاين
نكت وفوازير
قصص مضحكة
ألعاب وتسلية
منتدي الاغانى
ألبومات كاملة
أغانى منفردة
كليبات-Youtube
سياسة وأخبار
اخبار مصرية
اخبار عربية
اخبار مرئية
اخبار بالفيديو
اخبار بالصورة
فوتوغ-كاريكاتير
صور فوتوغراف
صور كاريكاتير
صور الطبيعة-الكائنات
خلفيات وصور
صور رومنسية
صور حزينة
صور أطفال
صور منوعة
صور غرائب وطرائف
انترنت وحاسب الى
نسخ وبرامج
شروحات البرامج والحاسب
لغات البرمجة
لغة Html
لغة Css
لغات واكواد اخرى
دعم واشهار
شروحات المنتديات
شروحات الاشهار
طلبات المساعدة
استايلات منتديات
ملحقات التصميم
طلبات التصميم
ابداعات الاعضاء
اخبار الرياضة
الكرة المصرية
الدوري الانجليزى
الدورى الاسبانى
الدورى الايطالى
بطولات عربية وعالمية
ملتميديا الرياضة
خلفيات رياضية
عالم الأسرة والطفل
حكم وامثال
طب وصحة
معرض صور
سحابة الكلمات الدلالية