قائمة احترافية لعرض خدماتك على بلوجر كتبها: المدون التقني - الخبير عامر بشير

Admin Amer

ديسمبر 11, 2017

0 تعليقات

شاركه غرد جوجل+

السلام عليكم ورحمة الله تعالى وبركاته أهلا بكم متابعي وأصدقاء الخبير عامر بشير ، مرحبا بك أخي / أختي القاريء (ة) في موضوع تقني جديد لهذا اليوم، نتمنى لكم الاستفادة ومتابعة ممتعة للجميع.

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

تركيب الاضافة سهل جدا 

معاينة

1. إبحث على  وضع هذا الكود فوقه

*{box-sizing:border-box;font-family:neo;margin:0;padding:0} .flex-container{display:flex;padding:.5em} .flex-item{flex:1;margin-right:1em;width:0} .flex-item:last-child{margin-right:0} .abdou_tap{border:1px solid #eee;list-style-type:none;margin:0;padding:0;transition:0.25s} .abdou_tap:hover{box-shadow:0 8px 12px 0 rgba(0,0,0,0.2);transform:scale(1.025)} .abdou_tap .abdou_tap-judul{background-color:#333;color:#fff;font-size:1.5em} .abdou_tap .highlight{background-color:#29b6f6} .abdou_tap li{background-color:#fff;list-style-type:none;border-bottom:1px solid #eee;padding:1.2em;text-align:center} .abdou_tap .abdou_aaa{background-color:#eee;font-size:1.25em} button{background-color:#29b6f6;border:none;border-radius:.15em;color:#fff;cursor:pointer;padding:.75em 1.5em;font-size:1em} @media only screen and (max-width:700px){button{padding:.75em}} @media only screen and (max-width:600px){.flex-container{flex-wrap:wrap}.flex-item{flex:0 0 100%;margin-bottom:1em;width:100%}.abdou_tap:hover{box-shadow:none;transform:none}button{padding:.75em 1.5em}}

1. الان هذا الكود ضعه في المكان الذي تريده في القالب مثل انا وضعته في الفوتر اي الجزء الاسفل في القالب 

<div class="flex-container"> <div class="flex-item"> <ul class="abdou_tap"><li class="abdou_tap-judul">فتح مدونةاجنبية</li><li class="abdou_aaa">20$</li><li>مدونة اجنبية</li><li>دومين هدية</li><li>قالب احترافي</li><li>اكواد ميتا احترافية</li><li class="abdou_aaa"> <button>اطلب الخدمة</button> </li></ul></div><div class="flex-item"> <ul class="abdou_tap"><li class="abdou_tap-judul highlight">تصميم قالب</li><li class="abdou_aaa">10$</li><li>خالي من الاخطاء</li><li>متجاوب</li><li>سريع</li><li>بدون تشفير</li><li class="abdou_aaa"> <button>اطلب الخدمة</button> </li></ul></div><div class="flex-item"> <ul class="abdou_tap"><li class="abdou_tap-judul">تصميم</li><li class="abdou_aaa">5$</li><li>لوجو</li><li>غلاف فيسبوك</li><li>غلاف يوتيوب</li><li>صورة لشرح</li><li class="abdou_aaa"> <button>اطلب الخدمة</button> </li></ul></div></div>

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

الكلمات المفتاحية :

Written by you: Technical blogger AMER BACHIR

URL Of Post:

http://ab-expert.blogspot.com/2017/12/blog-post_11.html

HTML Code Of Post:

<a href="http://ab-expert.blogspot.com/2017/12/blog-post_11.html"> قائمة احترافية لعرض خدماتك على بلوجر كتبها: المدون التقني - الخبير عامر بشير</a>