KHALED ALMILBE




مدون ومطور قوالب بلوجر
My E-mail : ###
My Phone No. : #%^$#
My Website : www.k2d.us

اترك رسالتك

الاسم (إختيارى)

عنوان بريدك الإلكترونى (مطلوب)

محتوى الرسالة (مطلوب)

تابعنا على :

f tw +G yt vk

لدعمنا قم بمتابعة المدونة ليصلك كل جديدنا

اضغط هنا

9/17/2016

ليست هناك تعليقات
2016-09-17T04:30:00+03:00

اضافة اداة تعريف الكاتب بشكل متحرك إحترافي

اضافة اداة تعريف الكاتب بشكل متحرك إحترافي

اضافة اداة جميلة ورائع لتعريف الكاتب
تتغير بمجرد مرور زر الفأرة عليها

طريقة الاضافة
اذهب للتخطيط - اضافة اداة- HTML/Javascript 
 وألصق الكود التالي مع تغيير مايلزم

<style>.card {  width: 300px;  height: 400px;  margin: 25px auto;  border-radius: 10px;  position: relative;  transform-style: preserve-3d;  transition: all 3s ease-in-out;  box-shadow: 0px 0px 0px #7F7970;}.card:hover {    transform: rotatey(180deg);}.card > div {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background-color: #34495e;    border-radius: 0px;    border: 0px solid #CCC;    text-align: center;    background-image: url('https://s10.postimg.io/jbhjp29qh/3_min.png');}.card .front {    z-index: 2;    backface-visibility: hidden;}.card .front header {    width: 100%;    height: 80px;    background-color: #397282;    border-radius: 0px 0px 0 0;}.card .front img {    width: 130px;    border-radius: 50%;    position: relative;    top: 10px;}.card .front h3{  margin-top: 70px;  color: #0AC;  font-size: 17px;}.card .front .mid {  list-style: none;  margin: 30px 0 -20px 0;  text-align: center;  color: #a2a2a2;  line-height: 1.6;}.card .front .mid li {  font-size: 20px;color: #ffffff;}.card .front span {    display: inline-block;    margin-top: 42px;    font-size: 20px;    color: #ffffff;    font-style: italic;    border: 1px solid #ffffff;    padding: 5px 80px;    border-radius: 0px 0px;} .card .back {    z-index: 1;    transform: rotatey(180deg);    background-color: #CCC;}.card .back header {  width: 100%;  height: 40px;  margin-top: 0px;  border-radius: 0px 0px 0 0;  background-color: #DF0069;  margin-right: 0px;  color: #fff;}.card .back p {  font-size: 25px;  position: absolute;  top: -35px;  left: 0;  width: 100%;}.card .back ul {    list-style: none;}.card .back span {    width: 90%;    display: inline-block;    text-align: center;    margin-top: 40px;color: #434343;    line-height: 1.2;    font-size: 20px;}.card .back .left {  margin: 5px;  text-align: center;}.card .back .left li {  font-size: 20px;  border: 1px solid #777777;color: #d03f42;  margin-bottom: 5px;  padding: 10px;  text-align: center;}.card .back img {    width: 97%;    height: 120px;    margin-top: 20px;
/* Another Symple Card-Back Style *//* .card .back {  background-color: #3D465F;}.card .back img {  width: 90%;  margin-top: 60px;  opacity: .5;} */</style>

<div class="card">  <div class="front">          <header>             <img src="https://cdn3.iconfinder.com/data/icons/avatar-set/512/Avatar02-512.png" /> </header>     <h3>حلولي</h3>     <section>        <ul class="mid">          <li>تطوير قوالب بلوجر</li>          <li>تعديل قوالب بلوجر</li>          <li>تصميم قوالب بلوجر</li>        </ul>     </section>     <span>تعرف علينا</span>  </div>                  <div class="back">     <header>        <p>تعرف علينا</p>     </header>     <section>         <span>هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق</span>         <ul class="left">            <li>facebook: @hlo1y</li>            <li>twitter: @hlo1y</li>            <li>instagram: @hlo1y</li>         </ul>       </section>  </div>  <!-- Another Symple Card-Back Style -->            <!--    <div class="back">                  <img src="https://cdn2.iconfinder.com/data/icons/website-icons/512/Website_Code-512.png">  </div>  </div>   --></div>
خطأ فى التحميل ! , ربما تكون المدونة غير عامة أو متاحة لمؤلفو المدونة فقط أو قد تكون خلاصة المدونة معطلة , من فضلك قم بجعل المدونة عامة و السماح بخلاصة المدونة كاملة لتفعيل هذه الإضافة , مزيد من المعلومات
عرض تعليقات : أو

ليست هناك تعليقات:

إرسال تعليق

المتابعون

حلولي *fb:https://www.facebook.com/hlo1y *tw:https://twitter.com/hlo1y *yt:https://www.youtube.com/user/v518v *gp:https://plus.google.com/+v518v *signature_img: https://2.bp.blogspot.com/-BB5G-R4BmMs/WYk0ptd5qGI/AAAAAAAAIuA/JYOxvfMzE9YdC1xMH9dytmkcAaWZt49XgCLcBGAs/s1600/sinature.png *txt: لـدي القليل مـن الخبره ، فـي مجال الـتدويـن اضع بالمدونة ما يـفـيـد الزائر والـمـدون ، تــابـعـنـا قـد نـفـيـدك يـومـاً peter hany *fb:https://www.facebook.com/peter.hany3 *tw: *yt: *gp: *signature_img:https://3.bp.blogspot.com/-_hF3OQo4bRA/WJ0VlzGC0qI/AAAAAAAAEUU/cddR54285KUQ1VigxKy-x8TUVwhsVEWUQCLcB/s1600/sinature.png *txt:اسمى بيتر هانى ميلاد , مصمم ومطور ويب , 20 سنة , مصرى الجنسية , أعيش فى محافظة المنوفية , طالب فى كلية الهندسة المدنية , أهتم بكل جديد فى مجال بلوجر وفى تطوير الويب , لدى خبرة فى إستعمال برامج الجرافيك , أحب تصميم القوالب البسيطة والتى تعطى إنطباع أنها ليست تحت فئة قوالب بلوجر ذات الإمكانيات المحدودة.