دورة تعلم < html> || الدرس الثالث||

[الأخ ياسين]

السلام عليكم و رحمة إن شاء الله هذا ثاني درس لنا في الدورة
(http://www.djelfa.info/vb)
المواضيع السابقة
http://www.djelfa.info/vb/images/smilies/24.gif
--------------------------------------------------
دورة تعلم < html> || الدرس الأول|| (http://www.djelfa.info/vb/showthread.php?t=709411)
------------------------------------------------
دورة تعلم < html> || الدرس الثاني|| (http://www.djelfa.info/vb/showthread.php?t=710446)
---------------------------------------------------
دورة تعلم < html> || الدرس الثاني|| (تابع) (http://www.djelfa.info/vb/showthread.php?t=713373)
---------------------------------------------------

نبدأ على بركته عز وجل

---------------------------------------------------------------------------------------------------------------------------------------------------------
نتابع مع الأكود الكتابية أنواعها و مهامها

أولا نفتح المحررر كما العادة

ثم نضع الأوسمة كما في المرة السابقة

http://www.djelfa.info/vb/images/statusicon/wol_error.gifإضغط هنا لرؤية الصورة بحجمها الطبيعي.http://up.djelfa.info/uploads/13156472511.png

------------------------------------------------------------
قد رأينا في بعض الصفحات مقالات بها صور و روابط فاليوم سنتعلم كيفية إدراج صورة في مقال بواسطة الوسم
<img src="رابط الصورة" alt="وصف و جيز للصورة" />
------------------------------------------------------------
بحيث نضع رابط الصورة وهو واضح
أما الوصف فيظهرلما مرور الماوس فو (http://www.djelfa.info/vb)ق الصورة

هكذا :::

http://up.djelfa.info/uploads/13191318651.gif

و المعاينة تظهر هكذا :::

:19:

http://up.djelfa.info/uploads/13191323061.gif

لكن أنا أحتاج الصورة أصغر قليلا كيف يمكن تعديل أبعادها برمجيا ؟؟؟
و نتابع مع بعض::

نعدل في الوسم السابقـــ
http://up.djelfa.info/uploads/13191337491.png




يصبح لدينا الكود التالي::

[<img src="رابط الصورة التي تريدها في صفحتك" width="طول الصورة" height="عرض الصورة" alt="وصف أو عنوان" />

مثال::

على نفس الصورة السابقة فقط عدلنا الأبعاد

http://up.djelfa.info/uploads/13191339441.png

لنرى النتيجة:::

http://up.djelfa.info/uploads/13191345331.png

قد تعبت انا الان سنكمل غدا إن شاء الله


http://up.djelfa.info/uploads/13160003821.png

[الأخ ياسين]

أتمنى أن ينال الدرس إعجابكم....

[الأخ ياسين]

أتمنى أن ينال الدرس إعجابكم....

لا أعتقد أن الموضوع قد نال إعجابك

[the_leader]

فعلا الدرس جميل
بارك الله فيك أخ ياسين

[the_leader]

لكن حبذا لو وضعت عنوان للدرس بحانب رابطه
دورة تعلم < html> || الدرس الثالث|| [ادراج صورة في الصفحة]

[the_leader]

أكواد css لتنسيق الصور في صفحة HTML
اسهل طريقة للتحكم في ا"هياكل أو بناءات او.." الـHTML هي طريقة الـ CSS
لتنسيق الصور في الصفحة لدينا هذا الأوامر
الحجم :بالبكسل(px) أو "سطر (em) أو نسبة مئوية(%)
---------- العرض: width
----------- الارتفاع: height
الهامش: هو الفراغ بين أطراف العنصر (الصورة) وما بجانبه من عناصر
margin: 1 2 3 4
يمكننا التحكم في الهامش على كل الجوانب بهذا الكود بالكتابة في مكان الارقام
---------- 1 : الهامش العلوي (بين الطرف العلوي للصورة وما يعلوها
---------- 2 : الهامش الأيمن (بين الطرف الأيمن للصورة وما بجانبها الأيمن
---------- 1 : الهامش السفلي (بين الطرف السفلي للصورة وما تحتها
---------- 1 : الهامش الأيسر (بين الطرف الأيسر للصورة وما بجانبها الأيسر
إذن تعديل أبعاد الصورة السابقة نكتب الكود الآتي

<style>
img {
width : 500px;
height: 300px;
margin: 0 0 0 0;
}

</style>

[الأخ ياسين]

أكواد css لتنسيق الصور في صفحة HTML
اسهل طريقة للتحكم في ا"هياكل أو بناءات او.." الـHTML هي طريقة الـ CSS
لتنسيق الصور في الصفحة لدينا هذا الأوامر
الحجم :بالبكسل(px) أو "سطر (em) أو نسبة مئوية(%)
---------- العرض: width
----------- الارتفاع: height
الهامش: هو الفراغ بين أطراف العنصر (الصورة) وما بجانبه من عناصر
margin: 1 2 3 4
يمكننا التحكم في الهامش على كل الجوانب بهذا الكود بالكتابة في مكان الارقام
---------- 1 : الهامش العلوي (بين الطرف العلوي للصورة وما يعلوها
---------- 2 : الهامش الأيمن (بين الطرف الأيمن للصورة وما بجانبها الأيمن
---------- 1 : الهامش السفلي (بين الطرف السفلي للصورة وما تحتها
---------- 1 : الهامش الأيسر (بين الطرف الأيسر للصورة وما بجانبها الأيسر
إذن تعديل أبعاد الصورة السابقة نكتب الكود الآتي

<style>
img {
width : 500px;
height: 300px;
margin: 0 0 0 0;
}

</style>

بارك الله فيك أخي

في الالوقت الحالي أنا لا أجيد انماط CSS رغم مدى المؤثرات الجمالية التي تضيفها لأني مازلت أتعلم الPhp && Html