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

مشاهدة النسخة كاملة : دورة تصميم الاستايلات وتويعها بتقنية css

الشبح
24-03-2011, 10:18 صباحاً
السلام عليكم ورحمة الله وبركاته

اليوم نقدم لكم اول درس من دروس توزيع وتصميم الاستايلات بالcss

الاستايلات الرباعية

http://www.mrsavb.com/vb/mrsa_2009/mrsa2year.gif


تم استخدام الاستايل السابق في التوزيع والتصميم




درس خارجي

-------------------------------------------------------------------------------
والان حمل الدرس الاول فيديو لتسطيب السيرفر الشخصي والمنتدى
http://filey.in/download.php?uid=VODOCLBD


-----------------------------------------------------------------------------------------------------
بسم الله
-----------------------------------------------------
الدرس الاول
تقطيع الاستايل
http://upload.traidnt.net/upfiles/VJE46171.png

http://www.mediafire.com/?kekza7q7vl15ckz
----------------------------------------------
الدرس 2
http://upload.traidnt.net/upfiles/Ie445820.png
توزيع الاستايل ع expression web
الجزء الاول
http://www.mediafire.com/?k7aofls69uvgduz
الجزء التاني
http://www.mediafire.com/?e9j5t5phe17t4tx

----------------------------------------------
الدرس 3
استبدال روابط الصور والتركيب ع المنتدى
وفحص االاكواد

http://www.mediafire.com/?6vydxqsywqiygr8

----------------------------------------------
الدرس 4
تركيب الخطوط كالعادة
http://www.mediafire.com/?g054bgkal1rpucu
----------------------------------------------
الدرس 5
تأطير الاقسام بتقنية css
الجزء الاول
http://www.mediafire.com/?smncushwcp3irj3
الجزء التاني
http://www.mediafire.com/?43cpnm92tq2k2dq
----------------------------------------------
الدرس 6
نظرة عامة عتلوين اجزاء الاستايل
الجزء الاول
http://www.mediafire.com/?cqcaenocydcdq69
الجزء التاني
http://www.mediafire.com/?yichm0ov648t33t
----------------------------------------------
الدرس 7


---------------------------------
والبقية تاتي:13:
شباب كافيه
24-03-2011, 11:02 صباحاً
الله علابداع يلا ماشي ياباشا متابع وحصمم احسن منك ههههههههههههههه
الشبح
24-03-2011, 11:14 صباحاً
الله علابداع يلا ماشي ياباشا متابع وحصمم احسن منك ههههههههههههههه
طيب مستنى
شباب كافيه
24-03-2011, 11:22 صباحاً
هههههه حنشوف بس يلا ورجينا حماس بس ياغالي لو كان في صور من الدرس عشان يبقى حماسي شويه
عبد الرحمان
25-03-2011, 02:59 صباحاً
بارك الله فيك أخي على الدرس و في انتظار باقي الدروس

متابع معكم
عبد الرحمان
29-03-2011, 06:22 صباحاً
بارك الله فيك أخي مرة أخرى

فقط بالنسبة للدرس الثاني ، شاهدت بعض الدروس في كلاس التمدد يكتب class عادي و أنت كتبت id

هل يوجد فرق بينهما ؟؟
الشبح
29-03-2011, 07:54 صباحاً
بارك الله فيك أخي مرة أخرى

فقط بالنسبة للدرس الثاني ، شاهدت بعض الدروس في كلاس التمدد يكتب class عادي و أنت كتبت id

هل يوجد فرق بينهما ؟؟
بص يالغالي
تابع معي
في بعض الأحيان تود أن تفعل خصائص ما على مجموعة أو فريق من العناصر،
من الممكن استخدام الكلاس للتجميع هذة االعناصر
وممكن استخدم id
للمطابقة صنف معين
كمثال ع الهيدر
انا اكتب

<div id="ex"><!-- كلاس تمدد الهيدر -->
<div class="up_r"></div><!-- كلاس صورة اليمنى للـ الهيدر -->
<div class="up_l"></div><!-- كلاس صورة اليسري للـ الهيدر -->
</div>
فكما ترى انا استخدم id لمطابقة نقطة التمدد
وكلاسات عادية لتجميع الصور
فقط لكي اربط بينهم
وهي افضل طريقة للمطابقة والتجميع
اذا لم تفهم قول يالغالي تحت امرك
عبد الرحمان
29-03-2011, 08:57 صباحاً
جزاك الله كل خير أخي الشبح فهمتك ، يعني لو استعمل class في مكان id عادي يعني ؟

أي تحدث معي أي مشاكل مستقبلا مع الهاكات أو ... ؟؟؟
عبد الرحمان
29-03-2011, 09:05 صباحاً
و أيضا يا غالي كتبت

<style type="text/css">
أنا أكتبها <style> فقط ، ما الفرق بين الكتابتين ؟؟؟

آسف جدا أخي إن أكثرت بالأسئلة ، اعذرني
الشبح
29-03-2011, 01:41 مساءً
جزاك الله كل خير أخي الشبح فهمتك ، يعني لو استعمل class في مكان id عادي يعني ؟

أي تحدث معي أي مشاكل مستقبلا مع الهاكات أو ... ؟؟؟
مافي اي مشكلة
و أيضا يا غالي كتبت

<style type="text/css">
أنا أكتبها <style> فقط ، ما الفرق بين الكتابتين ؟؟؟

آسف جدا أخي إن أكثرت بالأسئلة ، اعذرني
بالنسبة لهذة ايضا يالغالي
هناك 3 طرق لاستدعاء css
لتعرفها في المتصفح

الطريقة 1: ضمن وسوم HTML باستخدام خاصية style


</head> <body style="background-color: #FF0000;"> <p>This is a red page</p>
الطريقة 2: ضمت ملف HTML باستخدام وسم style


<style type="text/css"> body {background-color: #FF0000;} </style>

الطريقة 3: ملف خارجي


<link rel="stylesheet" type="text/css" href="style/style.css" />هذي هي الطرق كتابتك لاستايل وحدها يالغالي لاتكفى لان البرنامج بيساعدك ويوضحلك الكود اما اذا كنت تشتغل ع ملف خارجي لازم تحدد النوع للغة المستخدمةلانة هذي هي الطرق الصحيحة
حاتم محمد
11-04-2011, 11:39 مساءً
مجهودك رائع جدا أخى الكريم

اثابك الله عليه خير الثواب والجزاء ان شاء الله
حنينكم
28-06-2011, 03:51 صباحاً
http://img377.imageshack.us/img377/4555/44hk3.gif
تخسيس البطن
(http://fatayat./t52454.html)
مصممً فوتوشوبً
12-07-2011, 07:22 مساءً
اهلن اخوي
والله انت مبدع بمعنى الكلمهً.

انا عنديُ. مشكلهً. بالنافبار.ً يطلع التاطير بعيد شوي.ُ

تمامً. طيب.ٌ بطبق دروسكً. بس ي ترا هي للجيل الرابع ولا الثالث.ً؟

وهل الدروس هذه تنطبق على الجيلين سواً.؟
سجين الحال
15-07-2011, 06:34 صباحاً
بارك الله فيك


لكن عندي مشكلة في الاطار الرباعي في القوائم الايمن والايسر تطلع ابيض ولا يكون متمدد ماهو الحل
b55n
31-08-2011, 11:05 مساءً
الف شكر ياغالي ،،،،،،
منتديات مملكة اللولا
18-09-2011, 06:43 صباحاً
من جدة شرح ولا أروع مشكور
الشبح
18-09-2011, 02:22 مساءً
بارك الله فيك


لكن عندي مشكلة في الاطار الرباعي في القوائم الايمن والايسر تطلع ابيض ولا يكون متمدد ماهو الحل

تاكد من روابط الصور اخوي
الشبح
18-09-2011, 02:24 مساءً
اهلن اخوي
والله انت مبدع بمعنى الكلمهً.

انا عنديُ. مشكلهً. بالنافبار.ً يطلع التاطير بعيد شوي.ُ

تمامً. طيب.ٌ بطبق دروسكً. بس ي ترا هي للجيل الرابع ولا الثالث.ً؟

وهل الدروس هذه تنطبق على الجيلين سواً.؟

بالنسة لبعد التاطير
المشكلة في كود <br />
ابحث عنة تجدة اسفل كود التاطير

الدروس للجيل الثالث وتنبطق ع الجيل الرابع ولكن يجب ان يكون لديك خبرة في كيفي التعامل مع الجيل الرابع خبرة كبيرة لان المتغيرات في الجيل الرابع كثيرة
محمد خانقيني
19-09-2011, 01:54 صباحاً
عاشت الايادي
على شرح