×

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

دورة تصميم ستايل بتقنية css جديد 2011-2018 الدورة مقسمة على ثلاث اجزاء وهذا الجزء الاول متطلبات الدورة : 1- برنامج الفوتوشب لايهم اي اصدار ولكن

صورة 'soooon' الرمزية
6
قديمة 17 - 09 - 2010, 17:22
المشاركة 1
تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

دورة تصميم ستايل بتقنية css جديد
2011-2018

الدورة مقسمة على ثلاث اجزاء وهذا الجزء الاول

متطلبات الدورة :
1- برنامج الفوتوشب لايهم اي اصدار ولكن يدعم للعربي لمصلحتك
2- برنامج Microsoft Expression Web 2 البديل للفورنت بيج الفورنت بيج قديم لاينفع او استخدم برنامج الدريم ويفر .
3- وجود موقع على سيرفر شخصي او موقع تجريبي لتجربة الستايل علية

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

-------- لااريد سوى دعاؤكم الطاهر لي والوالدي بالخير والبركة والرحمة .-----------

واعتذر من المشرفين القائمين على هذا القسم اذا كانت الدروس " متوقفة في القسم " كما سابقا .

- الدروس لتصميم ستايل بتقنية css
افضل 100 مرة من تصميم ستايل بالطريقة التقليدية :
بعض الاشخاص سالوني ماالفرق بين تصميم ستايل بتقنية css عن الطريقة التقليدية ؟؟

طبعا لاانكر ان لغة css لغة جديدة ويوجد لغة على وجهه الانتهاء وهي css3 لانرف متى
المهم الجواب على السؤال

ما الفرق بين تصميم ستايل بتقنية css عن الطريقة التقليدية ؟؟
1- سريع التصفح متوافق مع جميع التصفحات خفيف " تلقى الزائر مبسوط من الموقع الانة سريع التصفح
2- منضم اكثر ومنسق بشكل اجمل والخطوط متوافق مع جميع التصفحات
3- كما قال صاحب لغة php أن لغة css وخاصة تطوير المواقع هي صممت لكي تساعد اصحاب المواقع القديمة الطراز على التطور لكي تصبح جديدة الطراز .
4- لايوج بة اخطاء وبامكانك بعد تصميم الستايل فحصة بهذا الموقع http://validator.w3.org/ w3c لتجد ان الستايل المصمم بتقنية css لايوجد به اخطاء حاول ان تضع رابط موقعك على استايلك الغير مصمم بلغة css ستجد اخطاء لابو موزه .. والسبب ان لغة html اصبحت قديمة جدا ..
5- هناك امور كثيرة ستكتشفها بنفسك بعد تصميم الستايل بتقنية css

لنضع معا النقاط على الحروف وناخذ درس بسيط في اللغة الانجليزية , فهذا لايخرج عن نطاق الدورة بل هو مهم للدورة وكل كلمة سنكتبها هنا فهي مهمة للدورة , واكيد هذة الكلمات مرت على الكثيرين والكثيرين عارفينها ولكن لتبسيط الامر ساكتبها فقط للعلم .

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]
قبل البداية في كتابة الكلمات ومعانيها اسمحولي بتوصيل معلومات قد تفيدكم .

نحن سنتعلم تصميم ستايل بتقنية css ونريد ان نعرف ماهي هذة التقنية ومن اين جاءت ..اوكي

- أن تقنية css هي اختصار لكلمة cascading style sheets ايش يعني هذا راح اقولكم معناها , صفحات الانماط الانسيابية , هذة اللغة ظهرت لكي تساعد المواقع القديمة الطراز على التطور للطراز الحديث , من ضمن مظمة w3c وهناك ايضا نفسة اللغة ستصدر حديثا وهي css3 فعلا انها لغة جميلة جدا , وخاصة لاصحاب المواقع , الذين يريدون الافضل لموقعهم .

- تيب لية اخترنا في دورتنا برنامج Microsoft Expression Web ؟ الجواب لأن هذا البرنامج تمت معالجتة بدقة .. لان برنامج مايكروسفت الفورنت بيج يوجد بة اخطاء كثيرة وايضا تقنيتة لاتساعد على ادراج الكلمات تلقائيا

أن برنامج Microsoft Expression Web 2 هو الأفضل , في دورتنا سنعتمد علية كل الاعتماد .... لانة عندما تكتب [ حرف الكلمة ] يعطيك نمط للكلمة كاملة وماعليك سوى اختيارها

- احب أن اذكر أن دورتنا التي ستقام باذن الله , بالأنجليزي .. وليس بالعربي فقط الشرح بالعربي يعني الاوامر بالانجليزي .

------------------------------------- هذة المصطلحات لابد من احصائها جيدا تقريبا 20 كلمة فقط ---------------------

1- header راس الصفحة
2- footer زيل الصفحة
3- color الوان
4- right يمين
5- left يسار
6- font خط
7- size حجم
8- link رابط / خط
9- text نص
10- center مركز / الوسط
11- body الجسم
12 - background خلفية
13 - table قاعدة / طاولة
14 - type شكل
15 - style نمط
16- title عنوان
17- none لاشيء
18- images صور
19- repeat تكرار
20 -width عرض
21 - height ارتفاع
22- repeat _x هذا المصطلح يعني تكرار التمدد الافقي
23 repeat _y هذا يعني تكرار التمدد عمودي
repeat-no لاتمدد


------------------------------------

بعض الاوامر التي سنستخدما من لوحة المفاتيح الكيبورت
وهي

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


-----------------------------------------------------------

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]







اذا لم تظهر الصور في المستقبل يوجد في [ المرفقات ] كتاب للشرح بصيغة pdf
حملة موفقين





مثال على الستايل حق الدورة


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




- يمكنكم تحميلة من المرفقات والدراسة علية - اي ستايل مخالف وغير مناسب بخلاف الستايل الى بالشرح سكون x غير مقبول اطلاقا .. يمكنك الاستغناء عن البنر الاعلاني فقط .



الحين شوفوا كيف قطعنا الستايل بكل دقة وحذر .. لاحظ المثال + ارجوكم اريد مشاركة بوضع الستايل + صورة لتقطيع الستايل ... ننتظركم


المقاسات [ مقاسات الستايل ] واهم شيء العرض وهو 800 حسب مقاسات شاشة المستخدم الارتفاع لايهم .


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]





الأن لاحظوا + شاهدوا التقطيع



تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




الحين نقوم بعد تقطيع الستايل بحفظة داخل القرص الصلب للي عندة سيرفر اما الى عندة موقع على استضافة مجانية فيمكنة وضعة على سطح المكتب ونكتفي بذالك


طريقة الحفظ للستايل بعد التقطيع


حفظة بصيغة


gif



هكذا



تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



ثم نختار


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]





تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


-


واحفظ عملك اما على سطح المكتب او على هذا المسار


c;/ wamp server -www-vb
طبعا الي بالون الزهر يختلف اسم مجلد برنامج السيرفر الشخصي حسب ماحملت اسم البرنامج.


[ رجع مقدمة الدرس لتحميل البرنامج متوفر رابط تحميل لة ]


الحين يوجد بعض الصور في مجلد الاستايل ليس لها اهمية نقوم بحذفها
لاحظ الصورة والمثال


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]
- بعد ذالك غير اسم الستايل من images الى اي اسم تبغاه لستايلك.




الحين نبدأ بفتح برنامج exprssion

من قائمة ستارت -- ابدأ

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



الصفحة الرئيسية للبرنامج

دوس على code .. يوجد كود جاهز في البرنامج لاحظ الصور

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



- من اجل الفهم اكثر سنقوم بتقسيم الكود الجاهز الى لقناه في البرنامج الى جزئين
لاحظ

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



الحين الكود رقم 1 الى بالصورة السابقة كالتالي

<title>Untitled 1</title>
والوسم
</head>

- نكتب بينهما الكود التالي
<style type="text/css"></style>
لاحظ الصور التالية وكيف كتبنا بداية الكود وبشكل تلقائي البرنامج يعطينا خيارات للكلمة
اولا : كتبنا اشارة >
ثانيا كتبنا style ثم مسافة بالمسطرة من لوحة المفاتيح ثم type سنجد البرنامج يعطيك كافة الكود بشكل تلقائي ...الخ

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


الحين رح يكون شغلنا في الكود الي كتبناه في المثال السابقة انظر اين رح يكون العمل

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




<style type="text/css">
هنا يتم كتابة الكود للجزء الاول بين هذا الوسم
</style>

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



الان نتكره
وننزل تحت لكي نبدأ بكتابة الكلاسات من الجزء الثاني للكود

لاحظ سنكتب الكود حق الكلاسات بين الوسم <body>

والوسم الثاني </body>

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


سنكتب الكود التالي ولاتخاف لان البرنامج سيساعد في اختيار الكلمة بشكل تلقائي
ولكن ملاحظة مهمة نختم كل عمل باشارة الفاصل المنقوطة وهي shift + حرف ك
طبعا كل شيء بالانجليزي يعني اعكس الكتابة الى الانجليزي وتابع . الكتابة مثل هذا الكود

<div class="h1"></div>


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]
تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]
ثم بعد اضافة h1 نقوم بالضغط على shift + الحرف ز
سيعطينا هذا القوس > او اشارة الاكبر والاصغر كما هو اسمها بالرياضيات
سيقوم البرنامج وبشكل تلقائي بوضع كود </div>


يصبح الشكل النهائي للكود
<div class="h1"></div>

هذ h1 تعني الصورة الممتدة للهيدر الى بالوسط الي عملناها نقطة تمدد في الهيدر وقمنا بتسميتها ب h1 الحين باقي 3 صور ايضا للهيدر طبعا مع صورة البانر الاعلاني اذا اردتم حذفة فيكون المجموع الكلي لصور الهيدر مع صورة نقطة التمدد هو 3 فقط
وليس اربعة 4 ذا في حال عدم عمل صورة البنر الاعلاني والا سيكون 4 صور للهيدر


نكتب نفس الطريقة للصورة الثانية للهيدر والثالثة والرابع يعني نغير فقط المتغير h
نعمل 3 اكواد اخر في الكلاسات هذ للصورة الاولى الى هي نقطة التمدد <div class="h1"></div> والثانية كذالك والثالثة كذالك والرابعة كذالك مع تغيير الى
h2 - h3-h4

لاحظ الصورة الثانية
تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


مع تغيير h في كل مره الى الرقم التالي 1 -2 -3 -4

ثم في النهاية نقوم بقص الوسم الي هو </div> فقط من اول صورة للهيدر ووضعها في نهاية الصورة الرابع شوف المثال


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

- الحين تحت الكود كامل نعمل مثلة تماما للفوتر
ولكن للعلم ان الفوتر ثلاث صور فقط 3 الصورة اليمنى واليرى والوسط الى هي نقطة التمدد
ونعطيها اسم متغير اخر وهو [ f ]

اسرع طريقة لعمل ذالك هي كالتالي




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


ثم

تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]






انتهينا من الجزء الثاني للكود
الى هو [ اكلاسات ]


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



<style type="text/css"></style>


صح ولا تذكرتوا راجعوا بداية هذا الدرس
ستتذكرون


وقلنا انا راح نكتب الجزء الاول بين


<style type="text/css">
هنا يتم كتابة الكود للجزء الاول بين هذا الوسم
</style>


اوكي نترك مسافة بينهما وذالك بالضغط على انتر
لنكتب بداية الكود


ونبدأ الكود
بالنقطة نقطة عادية مثال الى بين القوسين [ . ]


المثال




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



وبعدين بشكل تلقائي يعطينا البرنامج المتغيرات للهيدر بعد وضع النقطة اذا ماطلع لكم
المتغير الى هو h1-h2-h3-h4-f1-f2-f3 هذ كلها اسم متغيرات


اختر h1 للصورة الاولى وهي صورة التمدد للستايل في الهيدر


وتابع الصور كل الكود مكتوب بالصور لاداعي للكتابة والشرح بالكتابة .



تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



بعد اختيار backgraund -imagesسيظهر لنا امر اسمة


pick ULR


نختار صورة التمدد للهيدر


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]
بعد اختيار الصورة نختمها بالفاصلة المنقوطة


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



ثم نختار


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



ثم فاصلة منقوطة
احنا قلنا كل عمل نقوم به نختمة بفاصلة منقوطة


والحين نختار ارتفاع الصورة فقط


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



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


راجع الدرس الاول لكلمات اللغة الانجليزية.




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


نختم الوسم بالفاصلة المنقوطة وانتهينا من الاولى




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


الحين الصورة الثانية للهيدر نعمل نفس الطريقة السابقة
الى هي نقطة ثم نختار للصورة الثانية المتغير h2 انتبهه وليس h1 لانة اسم محجوز للصورة الاولى الي هي صورة نقطة التمدد


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

ثم فاصلة منقوطة + مسافة
ثم الارتفاع


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]



الشكل النهائي للكود حق الصورة الاولى نقطة التمدد


.h1{
background-image:url('yousefthawabh/yousefthawabh_02.gif');
background-repeat:repeat-x;height:170px;
}


-------------------------------------------------


الصورة الثانية


ثم العرض لان الصورة الثانية غير ممتدة


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

كما شرحت سابقا الارتفاع والعرض لاخذ المقاسات تروح الى مجلد الستايل
وبالشرح السابق تاخذ المقاسات
وليس على كيفك تحط من عندك .


وفاصلة منقوطة + مسافة ثم المحاذاه يسار left



تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




الشكل النهائي للصورة الثانية الكود هو


.h2{
background-image:url('yousefthawabh/yousefthawabh_01.gif');
background-repeat:no-repeat;height:170px;
width:246px;
float:left;
}
-------------------------------------------



الحين الصورة اليمنا نفس الشيء الى ان نصل الى المحاذاه وهي يمين وليس يسار
لان الصورة الثالثة هي يمين


اذن نختار right
ونختم بالفاصلة المنقوطة




تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]


الشكل النهائي للصورة الثالثة اليمنى



.h3{
background-image:url('yousefthawabh/yousefthawabh_04.gif');
background-repeat:no-repeat;height:152px;width:170px;
float:right;
}
-------------------------------------------



الحين صورة البنر الاعلاني الى هي لها المتغير h4


عند مرحلة المحاذاه لاتختار لايمين ولايسار اختر التالي
المحاذاه عائم
margin-left:0px


الشكل النهائي لكود الصورة الرابع الي هي البنر الاعلاني


.h4{
background-image:url('yousefthawabh/yousefthawabh_03.gif');
background-repeat:no-repeat;
height:170px;
width:292px; margin-left:0px;
}


-----------------------------------------


ملاحظة مهمة
نفس الكود الي سويناه للهيدر نسوية للفوتر
تحتة مباشره ولكن نغير اسم المتغير من h
الى مثلا f
ولكن لثلاث صور فقط لان الفوتر اصلا ثلاث صور


لاحظ المثال التالي


تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]




--------


يتبع أن شاء الله

لمن لاتظهر عنده الصور
1- يوجد كتاب بالمرفقات pdf
2- مجلد صور الشرح بالمرفقات
تصميم ستايل بتقنية css الجزء الاول [ لايفوتكم ]

الجزء الثاني
[/CENTER]
الملفات المرفقة
نوع الملف : zip book-css1.zip (459.5 كيلوبايت, عدد مرات المشاهدة 4047 مرة)
نوع الملف : zip book2-style-css.zip (198.0 كيلوبايت, عدد مرات المشاهدة 2908 مرة)
نوع الملف : zip الجزء الاول.zip (624.1 كيلوبايت, عدد مرات المشاهدة 2683 مرة)
محمد العانيني, hemagx, zaidq و 5 آخرون معجبون بهذا.
اذكرو الله يذكركم
لااله الا الله محمد رسول الله
المشاهدات 36620 | التعليقات 202
قديمة 17 - 09 - 2010, 17:38
المشاركة 2
صورة 'Ah.ELmasrY' الرمزية
Ah.ELmasrY
:: عضـــو::
تاريخ الإنضمام: 10 - 09 - 2010
رقم العضوية : 84139
الدولة : ام الدنيا
المشاركات: 114
1
افتراضي
رزقك الله بالخير والرحمة والبركة .. امين يارب

تسلم ايدك يا اخ يوسف مجهود جميل
الله أكبر , الله أكبر , الله أكبر , لا إله الا الله , الله أكبر , الله أكبر , ولله الحمد
لا اله الا انت سبحانك اللهم وبحمدك استغفرك واتوب اليك
سبحان من الف بين الثلج والنار يا من الف بين الثلج والنار الف بين عبادك المؤمنين
قديمة 17 - 09 - 2010, 18:22
المشاركة 3
صورة 'Dz-Mustapha 7' الرمزية
Dz-Mustapha 7
:: عضو نشيط ::
تاريخ الإنضمام: 18 - 02 - 2010
رقم العضوية : 78268
الدولة : الجنة يارب
العمر: 23
المشاركات: 4,142
6
افتراضي
مشكور اخي يوسف
لا اله الا الله محمد رسول الله
║▌║││ █ ▌│║█║▌║
║▌║││ █ ▌│║█║▌║
║▌║││ █ ▌│║█║▌║
AlGeRiA
© 2011
Viva Palestine
صرت أكره احط مواضيع بسبب بعض ناس
قديمة 17 - 09 - 2010, 19:26
المشاركة 4
صورة 'مـيدوو' الرمزية
مـيدوو
:: عضـــو::
تاريخ الإنضمام: 10 - 09 - 2010
رقم العضوية : 83258
الدولة : الجزائر
المشاركات: 50
افتراضي
والله شرح كافي ووافي تسلم ايدك
قديمة 17 - 09 - 2010, 21:00
المشاركة 5
صورة 'تصابير' الرمزية
تصابير
:: عضو نشيط ::
تاريخ الإنضمام: 24 - 10 - 2006
رقم العضوية : 27127
العمر: 36
المشاركات: 2,797
1
افتراضي
الله يوفقك ويسعدك

شرح وآضح وسهل

بأنتظار الجزء الثاني
قديمة 18 - 09 - 2010, 01:31
المشاركة 6
صورة 'Dohacom' الرمزية
Dohacom
:: عضو نشيط ::
تاريخ الإنضمام: 10 - 10 - 2004
رقم العضوية : 66
المشاركات: 737
افتراضي
جزاك الله خير الجزاء ووفقك دنيا وآخره ، ورحم الله والديك رحمه واسعه ..

ومنتظرين الجزء الثاني ..
سبحان الله .... والحمدلله .... ولااله الا الله .... والله اكبر
قديمة 18 - 09 - 2010, 02:02
المشاركة 7
صورة 'كافي ارهاب' الرمزية
كافي ارهاب
:: عضو نشيط ::
تاريخ الإنضمام: 18 - 04 - 2008
رقم العضوية : 57059
الدولة : العراق
العمر: 31
المشاركات: 2,309
2
قديمة 18 - 09 - 2010, 02:24
المشاركة 8
صورة 'ابو شدق' الرمزية
ابو شدق
.:: عضو شرف ::.
تاريخ الإنضمام: 23 - 02 - 2005
رقم العضوية : 1857
العمر: 45
المشاركات: 3,620
3
افتراضي
رائع جدا اخوي والدرس الاول بالصور
وياليت لو ترفق الصور بمجلد وتضغطه وترفقها بالمرفقات لضمان بقائها
يقول آينشتاين : "لا يمكن حل مشكلة باستخدام العقلية نفسها التي أنتجتها"

حللونا وانتم بحل
قديمة 18 - 09 - 2010, 07:14
المشاركة 9
صورة 'malqa' الرمزية
malqa
:: عضو فعال ::
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 71798
المشاركات: 126
افتراضي
صراحه مجهود جبار

وانا والله ودي اتعلم التصميم بـ css مميزاتها حلوه ومفيدهـ بنفس الوقت !

بس والله لو يكون الدرس بالفيديو عشان المبتدئين اللي مثلي يستوعبون اكثر من الصور ,

على العموم يعطيك الف عافيه وماقصرت!
Mr.Lost معجب بهذا.
منتديات خبول

www.5bol.com/vb

قديمة 18 - 09 - 2010, 10:43
المشاركة 10
أبن العروبة
:: عضو جديد ::
تاريخ الإنضمام: 10 - 09 - 2010
رقم العضوية : 84908
المشاركات: 8
افتراضي
أبداع X أبداع
وفي أنتظار الجزء الثاني : + أحلي تقيم لعيونك

تحياتي لك أخي الحبيب
منتديات أجيال فلسطين


البريد : [email protected]
قديمة 18 - 09 - 2010, 16:36
المشاركة 11
صورة 'adeleqo' الرمزية
adeleqo
:: عضو نشيط ::
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 73870
العمر: 42
المشاركات: 1,184
11
افتراضي
كنت اتمنى ان تبقى الدروس في ترايدنت اخي فلا نريد ان نتشعب كثيراً في مواقع لكي نتعلم هذه الخاصيه

وان شاء الله ساعمل على هذا التصميم المتواضع المأخوذ من تقريباً من موقع ثاني لكي اعمل عليه




ويا ريت البرنامج الي اشتغلت عليه وهل ينفع الفرونت بيج ام لأ ؟؟؟
قديمة 18 - 09 - 2010, 17:42
المشاركة 12
صورة 'soooon' الرمزية
soooon
:: عضو نشيط ::
تاريخ الإنضمام: 18 - 02 - 2010
رقم العضوية : 78392
الدولة : jordan
العمر: 32
المشاركات: 3,462
6
افتراضي
اقتباس
رزقك الله بالخير والرحمة والبركة .. امين يارب
تسلم ايدك يا اخ يوسف مجهود جميل
Ah.ELmasr شكرا لك بارك الله فيك ولك مثل اجر الدعاء ان شاء الله منور

اقتباس
مشكور اخي يوسف
BlaCk BoY العفو منور

اقتباس
والله شرح كافي ووافي تسلم ايدك
مـيدوو الله يسلمك مشكوور

اقتباس
الله يوفقك ويسعدك
شرح وآضح وسهل
بأنتظار الجزء الثاني
مجالس البادية قريبا باذن الله تعالى

اقتباس
جزاك الله خير الجزاء ووفقك دنيا وآخره ، ورحم الله والديك رحمه واسعه ..
ومنتظرين الجزء الثاني ..
قريبا باذن الله تعالى اخ Dohacom

اقتباس
شكرآ لك اخوي
بس لو يكون شرح فيديو افضل
تحياتي
كافي ارهاب اخي الصور افضل بكثير من الفيديو وهذا الموجود .



اقتباس
رائع جدا اخوي والدرس الاول بالصور
وياليت لو ترفق الصور بمجلد وتضغطه وترفقها بالمرفقات لضمان بقائها
ابوشدق هلا استاذي يوجد بالمرفق الصور في كتاب اذا لاحظت منور


اقتباس
صراحه مجهود جبار
وانا والله ودي اتعلم التصميم بـ css مميزاتها حلوه ومفيدهـ بنفس الوقت !
بس والله لو يكون الدرس بالفيديو عشان المبتدئين اللي مثلي يستوعبون اكثر من الصور ,
على العموم يعطيك الف عافيه وماقصرت!
malqa بصراحة الصور افضل للكثيرين يعني لو عملنا شرح فيديو يقولوا اخ لو الدرس مصور وهكذا
منور

اقتباس
أبداع X أبداع
وفي أنتظار الجزء الثاني : + أحلي تقيم لعيونك
تحياتي لك أخي الحبيب
أبن العروبة الله يعزك مشكوور على التقييم



اقتباس
كنت اتمنى ان تبقى الدروس في ترايدنت اخي فلا نريد ان نتشعب كثيراً في مواقع لكي نتعلم هذه الخاصيه

وان شاء الله ساعمل على هذا التصميم المتواضع المأخوذ من تقريباً من موقع ثاني لكي اعمل عليه
ولاوين يعني الدوس هاهي في ترايد نت وانسى امر بلاك
اذكرو الله يذكركم
لااله الا الله محمد رسول الله
قديمة 18 - 09 - 2010, 22:02
المشاركة 13
صورة 'adeleqo' الرمزية
adeleqo
:: عضو نشيط ::
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 73870
العمر: 42
المشاركات: 1,184
11
افتراضي
اقتباس
ولاوين يعني الدوس هاهي في ترايد نت وانسى امر بلاك

ههههههههههههههههههههههه معذره اخي
فانا لم انتبه انه الي واضع روابط الدروس ليس انت

وان شاء الله بعد تحميل البرنامج الذي استخدمته سابدأ بالتطبيق معك وان شاء الله الليله اضع التطبيق
لانه تحميل البرنامج بده شويه وقت
قديمة 19 - 09 - 2010, 00:31
المشاركة 14
صورة 'adeleqo' الرمزية
adeleqo
:: عضو نشيط ::
تاريخ الإنضمام: 15 - 10 - 2009
رقم العضوية : 73870
العمر: 42
المشاركات: 1,184
11
افتراضي
الحمد بدأت التطبيق ولكن عندما وصلت للفاصله المنقوطه توقفت :(:(

ما ظهرت الفاصله المنقوطه عن shift+ك

اقتباس



ثم نختار


لان الي يظهر بهذا الاختصار هو نقطتين فوق بعض .

ولكن اعتقد انه ظهرت الفاصله المنقوطه عند shift + ح

وعند وضعها تظهر اشاره حمراء تحتها اظن انها توضح ان الرمز خاطىء فاين نجد بالضبط تلك الفاصله

اه تذكرت شيء آخر ...

عند هذه النقطه التي نبدأ بكتابة الكود الذي يبدأ بنقطه

بعد كتابة النقطه لم تظهر لي المتغرات ولم تكمل لي العباره بل وضعتها بنفسي .h1{ معكوسه


وهذا الكود الي وصلت اليه للآن

رمز Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 2</title>
<style type="text/css"> 
.h1{
	background-image:url('file:///C:/Users/adeleqo/Desktop/ستايلات تحت التصميم/الاحلام مع ترايدنت css/images/sraj_02.gif')؛
}
</style>
</head>

<body>
<div class="h1">
<div class="h1"></div>
<div class="h1"></div>
<div class="h1"></div>
</div>
<div class="f1">
<div class="f1"></div>
<div class="f1"></div>
<div class="f1"></div>
</div>
</body>

</html>

قمت بتعليم الفاصله الي ظهرت باللون الاحمر نتيجة الاختصار shift+ح ولكن لم تظهر لي التكمله التلقائيه


بانتظار ردك للمتابعه في الدوره ومشكور جداً
قديمة 19 - 09 - 2010, 00:48
المشاركة 15
أصيل العود
:: عضو نشيط ::
تاريخ الإنضمام: 09 - 11 - 2006
رقم العضوية : 27880
الدولة : الخليج
المشاركات: 2,792
6
افتراضي
تسلم يا كينج وباذن الله بالمفضله وراح ارجعلها مره اخرى
 
اضافة رد
 

ورشة عمل لإقامة إستايل متكامل[مغلق للمشاركه] شرح وضع المنتدى وآخر مشاركة والمواضيع والمشاركات والمراقبين تحت كل قسم في الرئيسية

أدوات الموضوع ابحث في الموضوع
ابحث في الموضوع:

البحث المتقدم
طرق العرض


الساعة معتمدة بتوقيت جرينتش +3 . الساعة الآن : 00:53.
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسئولية نفسه إتجاه مايقوم به من بيع وشراء وإتفاق وأعطاء معلومات موقعه
التعليقات المنشورة لا تعبر عن رأي معهد ترايدنت ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر)

جميع الحقوق محفوظة Traidnt 2019
  • 00966138651070
  • 00966138648289
  • 2051033691
Powered by vBulletin® Version 3.8.11 .Copyright ©2000 - 2020, Jelsoft Enterprises Ltd
SEO by vBSEO ©2011, Crawlability, Inc.