منتدى الابداع العربي

للإبداع لمسات ! ... ولمسـات الإبــداع إختصاصـنا !
 
الرئيسيةالرئيسية  المنشوراتالمنشورات  البوابةالبوابة  التسجيلالتسجيل  دخولدخول  


الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)
 

 الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)

اذهب الى الأسفل 
انتقل الى الصفحة : 1, 2  الصفحة التالية
كاتب الموضوعرسالة
JoryAbdallah
سوبر الإبداع 

JoryAbdallah

انثى
السمك
عدد المساهمات : 126351
نقاط النشاط : 142037
السٌّمعَة : 2980
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 34
الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Yoo_ao11

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالأحد نوفمبر 27, 2016 5:27 am

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)
الدرس الثاني : التعرف الكلاس واكواد css وطريقة عملها ووضعها (جزء2)
السلام عليكم ورحمة الله وبركاته
اسعد الله اوقاتكم بكل خير
نقدم لكم الدورة الحصرية من اعداد اختكم JAR7
دورة احتراف تكويد استايلات التومبلايت لاحلى منتدى

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) 67049810
.
هتتكون الدورة بعون الله مجموعه دروس
1- الدرس الاول : تهيئة قوالب التومبلايت للعمل عليها
2- الدرس الثاني : التعرف الكلاس واكواد css وطريقة عملها ووضعها
3- الدرس الثالث : تقطيع الاستايل المصمم عن طريق الفوتوشوب وكيفية حفظة
4- الدرس الرابع : عمل كلاسات للاستايل الذي تم تقطيعه بالقوالب التي
سيتم العمل بها  :/
5- الدرس الخامس : عمل ورقة css للكلاسات لكي تعمل بالمنتدى
6- الدرس السادس : وهو الاخير اخراج العمل والانتهاء من الاستايل

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Uo_ouo20
الدرس يوتيوب مدة 28 دقيقة حاولت الاسراع واول مرة لم اعد الدرس الحمد لله ههههههه
تعرفنا على هذا الدرس عمل نافبار او عمل هيدر به ازرار او ايقونات تواصل اجتماعي
فوائد الدرس :
طريقة عمل كلاسات صحيحة للتصميم
طريقة التقطيع الصحيحة
طريقة عمل كلاس الازرار سواء بصورة او بعمل خلفية
تعرفنا على اوامر جديدة باكواد css
امر التمدد padding
امر الانزياح margin
امر تباعد الاسطر line-heigh
امر حجم الخط font-size
امر توسيط الخط text-align
امر عمل حواف دائرية border-radius

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

الدرس اليوتيوب مشاهدة :/

https://youtu.be/j1hzrMNx5tY

الكلاسات التي تم عملها بالدرس
الكود:


<div class="nnb">
<div class="nnr">
<a href="#" title="الرئيسية">الرئيسية</a>
<a href="#" title="التسجيل">التسجيل</a>

<a href="#" title="اتصل بنا">اتصل بنا</a>

</div>
<div class="nnl">
<a href="#" title="تابعنا بتويتر"></a>
<a href="#" title="تابعنا على قوقل بلس"></a>

<a href="#" title="تابعنا rss"></a>

<a href="#" title="تابعنا فيس بوك"></a>

</div>

</div>

اكواد css

الكود:

.nnb{
   background-image:url('https://i37.servimg.com/u/f37/16/46/77/76/uo-ouo14.gif');
   background-repeat:repeat;
   height:90px;
}
.nnl{
   background-image:url('https://i37.servimg.com/u/f37/16/46/77/76/uo-ouo13.gif');
   background-repeat:no-repeat;
   float:left;
   height:90px;
   width:223px;
}
.nnl a {
    float: left;
    height: 80px;
    margin-left: 3px;
    padding: 1px;
    width: 50px;
}
.nnr{
   float:right;
}
.nnr a {
    background: #fff none repeat scroll 0 0;
    border-radius: 5px;
    color: #000;
    float: right;
    font-size: 18px;
    height: 50px;
    line-height: 50px;
    margin: 10px;
    padding: 5px;
    text-align: center;
    width: 100px;
}


وختاما احلى سلام :/
اختكم JAR7
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://taqnyiat.ahlamontada.com/
Basil Abdallah
سوبر الإبداع 

Basil Abdallah

ذكر
السمك
عدد المساهمات : 11108
نقاط النشاط : 11943
السٌّمعَة : 70
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Jordan10
العمر : 25

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالأحد نوفمبر 27, 2016 2:34 pm

كل الشكر و التقدير على الدرس الرائع ولا ازال متابع هذه الدورة المميزة الى حد الانتهاء و الاحتراف
الرجوع الى أعلى الصفحة اذهب الى الأسفل
JoryAbdallah
سوبر الإبداع 

JoryAbdallah

انثى
السمك
عدد المساهمات : 126351
نقاط النشاط : 142037
السٌّمعَة : 2980
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 34
الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Yoo_ao11

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالأحد نوفمبر 27, 2016 7:53 pm

وفيك بوركت اخي العزيز
سيتم وضع دروس بشكل اسرع بعون الله تعالى


الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Img_2010
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://taqnyiat.ahlamontada.com/
Abshahad
سوبر الإبداع 

Abshahad

ذكر
الاسد
عدد المساهمات : 23608
نقاط النشاط : 27156
السٌّمعَة : 90
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Sudan10
العمر : 39

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالخميس ديسمبر 01, 2016 8:37 am

لكي الف شكر دمتي ودام عطائك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://www.ibda3araby.com/
عشقك يكفيني
عضو خبير 

عشقك يكفيني

انثى
العقرب
عدد المساهمات : 576
نقاط النشاط : 615
السٌّمعَة : 9
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 33

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالخميس ديسمبر 01, 2016 3:38 pm

شرح مميز وبسيط .. يسلمو على جهود
وتوضيح في محله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
L.Mogdad
إشراف عام الأقسام 

L.Mogdad

ذكر
الجوزاء
عدد المساهمات : 16312
نقاط النشاط : 20451
السٌّمعَة : 71
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 19

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالسبت ديسمبر 03, 2016 1:34 pm

لكي الف شكر دمتي ودام عطائك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
JoryAbdallah
سوبر الإبداع 

JoryAbdallah

انثى
السمك
عدد المساهمات : 126351
نقاط النشاط : 142037
السٌّمعَة : 2980
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 34
الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Yoo_ao11

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالثلاثاء ديسمبر 06, 2016 11:17 pm

منور اخي العزيز


الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Img_2010
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://taqnyiat.ahlamontada.com/
روجر الذهبي
عضو ذهبي 

روجر الذهبي

ذكر
الاسد
عدد المساهمات : 3805
نقاط النشاط : 4290
السٌّمعَة : 15
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Morocc10
العمر : 24

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالإثنين ديسمبر 12, 2016 4:10 pm

شكرا جرح
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mr. Loay
سوبر الإبداع 

Mr. Loay

ذكر
الجوزاء
عدد المساهمات : 6242
نقاط النشاط : 7090
السٌّمعَة : 65
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Saudi-10
العمر : 16

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالإثنين ديسمبر 19, 2016 6:46 pm

شكرآآ لك , ع الموضوعع الجميللَ الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) 2821261694>


سبحان الله وبحمده ..
          سبحان الله العظيم ...

اللهم صلِّ وسلم على محمد.. وعلى آله وصحبه أجمعين


الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Uia_io10
الرجوع الى أعلى الصفحة اذهب الى الأسفل
AbdallahBeraida
عضو التميز 

avatar

ذكر
عدد المساهمات : 5391
نقاط النشاط : 6288
السٌّمعَة : 368
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Morocc10

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالثلاثاء فبراير 21, 2017 4:57 pm

بسم الله الرحمن الرحيم والصلاة والسلام على سيدنا
محمد وعلى آله وصحبه أجمعين 
أتمنى أن تكونِ بأفضل حال وصحة وخير
ما شاء الله كما عهدنا منكِ دوماً وما سنبقى نراه أيضا
مواضيعك الرائعة المنتشرة في جميع أرجاء المنتدى
فأنتِ شمعة مضيئة لا ينقطع عطائها ما شاء الله
أحب أن أرى مواضيعكِ وأستمتع بالرد علهيا عادة
انه لرائعٌ أن أرى ابداعكِ دائما وأبدي رأيي به
وما رأي الا ثناءُ فهل تستحقين أنتِ غير ذلك ~ ما شاء الله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mr Robot
سوبر الإبداع 

Mr Robot

ذكر
القوس
عدد المساهمات : 35481
نقاط النشاط : 37581
السٌّمعَة : 108
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Lebano10
العمر : 34

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالسبت مارس 04, 2017 6:32 pm

شكرا لك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Mr Robot
سوبر الإبداع 

Mr Robot

ذكر
القوس
عدد المساهمات : 35481
نقاط النشاط : 37581
السٌّمعَة : 108
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Lebano10
العمر : 34

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالسبت مارس 04, 2017 6:33 pm

شكرا لك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
abuahmad
عضو محترف 

abuahmad

ذكر
السرطان
عدد المساهمات : 1485
نقاط النشاط : 1637
السٌّمعَة : 4
العمر : 53

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالسبت أبريل 22, 2017 3:30 pm

رائع

تسلم الايادى

تحياتي
الرجوع الى أعلى الصفحة اذهب الى الأسفل
منصورة
سوبر الإبداع 

منصورة

انثى
الدلو
عدد المساهمات : 13970
نقاط النشاط : 16963
السٌّمعَة : 51
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Algeri10
العمر : 57

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالجمعة مايو 19, 2017 12:49 pm

شرح بسيط ومميز اختي جوري
الف شكر على الإفادة
تقبلي مروري وتقديري


كل القلوب إلى الحبيب تميل
ومعي بهذا شاهد ودليل
اما الدليل إذا ذكرت محمداً
صارت دموع العارفين تسيل
هذا رسول الله نبراس الهدى
هذا لكل العالمين نبيا
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.manssora.com/
Picasso-Des
سوبر الإبداع 

Picasso-Des

ذكر
الجدي
عدد المساهمات : 10774
نقاط النشاط : 11116
السٌّمعَة : 136
بلد العضو : الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Ioao10
العمر : 36

الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Empty
مُساهمةموضوع: رد: الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)   الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) Emptyالسبت يونيو 16, 2018 11:18 pm

يعطيكم العافية على الطرح الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) 837876428
كل الاحترام الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور) 433646733
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://medialive.pro
 
الدرس الثاني : جزء 2 (عمل ازرار للهيدر وتوجيهه لصور)
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 2انتقل الى الصفحة : 1, 2  الصفحة التالية

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتدى الابداع العربي ::  تقنيات احلى منتدى ::  تقنيات أحلى منتدى :: دورة تكويد استايلات احلى منتدى-
انتقل الى:  
جميع الحقوق محفوظة لمنتدى الإبداع العربي 2020