المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : درس مفصل 1: دورة html المستوى الثاني متقدم تقنية الـ CSS



salima
11-01-2013, بتوقيت غرينيتش 04:31 PM
http://www.dzbatna.com/images/icons/icon18.gif ط¯ط±ط³ 1: ط¯ظˆط±ط© html ط§ظ„ظ…ط³طھظˆظ‰ ط§ظ„ط«ط§ظ†ظٹ ظ…طھظ‚ط¯ظ… طھظ‚ظ†ظٹط© ط§ظ„ظ€ CSS (http://www.dzbatna.com/t2171586/)




http://www.alshrera.com/losha/1-losha.gif








بكل الحبhttp://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gif نلتقى من جديد

http://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gifhttp://files.maas1.com/images_cache/111113000531Oj7v.gifhttp://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gifhttp://files.maas1.com/images_cache/111113000531Oj7v.gifhttp://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gifhttp://files.maas1.com/images_cache/111113000531Oj7v.gif (http://www.losha.net)http://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gifhttp://files.maas1.com/images_cache/111113000531Oj7v.gifhttp://www.ct-7ob.com/vb/storeimg/live_1340998091_503.gif

http://www.dzbatna.com/images/icons/iconrote.gif (http://sa.ae/4239505/)http://www.arabw-pearl.com/vb/images/icons/tanbeh.gif (http://sa.ae/4239505/)http://www.dzbatna.com/images/icons/iconrote.gif (http://sa.ae/4239505/) الرجاء قرائة الموضوع كاملاً وعدم القفز بين السطور لتوضيح ما قد يغيب عنك والإستفادة من إستخدام الشرح طريقة لأقصى درجة


http://www.losha.net/wp-content/uploads/html.jpg






درس مفصل 1: ما هي تقنيةCSS ؟



لعلك سمعت عن CSS من قبل لكن لا تعرف حقاً ما هي، في هذا الدرس مفصل ستتعلم المزيد عن CSS وماذا يمكن لهذه التقنية أن تقدم لك.

CSS هي اختصار لي Cascading Style Sheets .


ماذا يمكن أن أفعل بتقنية CSS؟


CSS هي لغة تصميم تحدد شكل وثيقة HTML ،
فهي تهتم
http://upload.dzbatna.net/upfiles/5fW74184.gifبالخطوط ،
http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gifالألوان ،
http://upload.dzbatna.net/upfiles/5fW74184.gifالهامش ،
http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gifوالعرض والارتفاع ،
http://upload.dzbatna.net/upfiles/5fW74184.gifصورة خلفية الموقع ،
http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gifوكيفية توزيع المساحات وأشياء أخرى كثيرة،
انتظر فقط وسترى!



HTML يمكن أن تستخدم بشكل خاطئ لإضافة تصميم للمواقع ،
لكن CSS توفر المزيد من الخيارات وهي أكثر دقة وعملية ،
وهي مدعومة من قبل المتصفحات الرئيسية اليوم.

بعد أجزاء قليلة في هذا الدرس مفصل ستتمكن من إنشاء ملف CSS الأول لكي تعطي موقعك مظهراً رائعاً.


ما الفرق بين CSS وHTML؟


تستخدم لوضع هيكلية ونظام منطقي للمحتويات، أما CSS فهي تستخدم لإضافة تصميم لهذه المحتويات.

حسناً، قد يبدو هذا مربكاً لكن أكمل القراءة وستفهم ما قرأته قريباً.

في الماضي القريب اخترع رجل اسمه تيم بيرنرز لي شبكة الويب، في ذلك الوقت كانت HTML تستخدم فقط لإضافة هيكلية للنص، الكاتب يمكنه أن يقوم بإضافة معنى للنص بأن يقول مثلاً &quot;هذا عنوان&quot; أو &quot;هذه فقرة&quot; ويستخدم وسوم HTML مثل <h1> و<p>.

مع ازدياد شهرة شبكة الويب بدأ المصممون في البحث عن طرق لإضافة تصميم للوثائق،
ولتلبية رغباتهم قام مبرمجوا المتصفحات - نيتكسيب ومايكروسوفت - باختراع وسوم HTML جديدة مثل <font> الذي يختلف عن وسوم HTML الأصلية بأنه يهتم بالشكل لا بالهيكلية.

أدى ذلك إلى أن تستخدم وسوم هيكلية مثل <table> بشكل خاطئ، حيث استخدام هذا الوسم لتحديد تصميم الصفحة بدلاً من إضافة معنى للنص ،
والكثير من الوسوم التي اخترعت مثل <blink> كانت فقط مدعومة من قبل متصفح واحد ،
أصبحت جملة joomla &quot;ستحتاج إلى المتصفح الفلاني لرؤية هذه الصفحة&quot; مألوفة في مواقع الشبكة .



ابتكرت CSS لعلاج هذه المشكلة لأنها توفر للمصممين طرقاً فعالة وعملية لإنشاء التصاميم وهذه التصاميم ستكون مدعومة من قبل جميع المتصفحات في نفس الوقت ،
والفصل بين شكل الصفحة ومحتوياتها يبسط عملية إدارة الموقع بشكل كبير.


كيف ستفيدني CSS؟

تعتبر CSS ثورة في عالم تصميم المواقع، وفوائدها الأساسية هي:



• التحكم بالتصميم من خلال ملف واحد.
• إمكانية أكبر وأدق للتحكم بتفاصيل التصميم.
• إنشاء تصاميم خاصة لمختلف وسائل عرض الموقع مثل الشاشات والطابعات والهواتف النقالة .. إلخ
• العديد من التقنيات والأساليب المتقدمة في التحكم بالتصميم .

http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gif http://upload.dzbatna.net/upfiles/5fW74184.gifhttp://upload.dzbatna.net/upfiles/5fW74184.gifيتبع



ولله الحمد تم الدرس مفصل الأول ورزقاً طبياً مباركاً

فإن كان به خطأ فإنه منى وأنسانى إياه الشيطان الرجيم
وإن أصبت فإنه من فضل الله عز وجل علينا
http://www.losha.net/mypictures/fasl02.gif
وفي ختام هذا الشرح طريقة أدعوا الله لي ولكم ولوالدينا ولمن أحببناه في الدنيا
بالهداية والصلاح في الدنيا وأن يجمعنا جميعاً في الفردوس الأعلى ....
http://i151.photobucket.com/albums/s133/moooon_light30/icons/1.gif
سبحانك اللهم وبحمدك , أشهد أن لا اله إلا أنت أستغفرك وأتوب إليك
أخوكم فى الله
Ali Losha
http://www.alshrera.com/losha/4-losha.gif
http://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-ash3/179903_421332584577441_472031567_n.jpg

مصدر الدرس مفصل : درس مفصل 1: دورة html المستوى الثاني متقدم تقنية الـ CSS (http://www.losha.net/%D8%AF%D8%B1%D8%B3-1-%D8%AF%D9%88%D8%B1%D8%A9-html-%D8%A7%D9%84%D9%85%D8%B3%D8%AA%D9%88%D9%89-%D8%A7%D9%84%D8%AB%D8%A7%D9%86%D9%8A-%D9%85%D8%AA%D9%82%D8%AF%D9%85-%D8%AA%D9%82%D9%86%D9%8A%D8%A9-%D8%A7/)





التعديل الأخير كان بواسطة Losha; 06 - 10 - 2014 الساعة 22:22

ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)




https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى