مدير الموقع

مرحبا بكم في موقع تقني الانترنت انا الياس عوادي مدير الموقع عمري 17 سنة من الجزائر ارحب بكم في موقعي تقني الانترنت ستجدون في هاذا الموقع كل مايتعلق بالتقني ساعرض عليكم دروس حصرية ومميزة في جميع المجالات سوا كانت في بلوجر او الاندرويد او الفيسبوك او جوجل والمزيد من المجالاتالموقع كل مايتعلق بالتقني ساعرض عليكم دروس حصرية ومميزة في جميع المجالات سوا كانت في بلوجر او الاندرويد او الفيسبوك او جوجل والمزيد من المجالات

أضفنا لدوائرك

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

صناديق واردة الشكل الأول

إضافة جميلة لعرض مواضيع بشكل منسق ولطيف التصميم يحتوي فقط على أكواد سس لذلك لا داعي للقلق حول الثقل، تضم الإضافة أربعة صناديق بنفس الحجم مع بعض التعديلات تم إضافة ألوان متعددة تتناسق مع شكل الصورة، وكذلك حجم الصورة أياً كان فسيتناسب تلقائياً أترككم مع المعاينتان

شرح  طريقة التركيب
1. توجه لتخطيط
2. أضف أداة HTML/JAVASCRIPT
3. ضع بها الكود التالي

<style>   
.befeature{height: 250px;overflow: hidden;width: 995px;padding: 0px 0px 0px 0px; margin: 0 auto;}
.bebox:hover{margin-top: -180px;}
.bebox{float: right;height: 485px;margin: 0px 9px 0px 9px;margin-left: 0%;moz-transition: all .3s ease-in-out;ms-transition: all .3s ease-in-out;o-transition: all .3s ease-in-out;overflow: hidden;padding: 193px 0 0 0;transition: all .3s ease-in-out;webkit-transition: all .3s ease-in-out;width: 24%;}
.beupbox{height: 50px;margin: 0;overflow: hidden;padding: 5px 10px 0px 10px;width: 100%;}.beupbox h1{color: #fff;font-family: cursive,droid arabic kufi;font-size: 15px;font-weight: 400;margin: 0;padding: 0px 0px 0px 0px;width: 95%;text-shadow: 0 -1px 0 rgba(137, 137, 137, 0.25);}
.beupbox a{text-decoration: none;}
.bedownbox{height: 400px;margin: 0;padding: 5px 10px 0px 9px;width: 94%;}
.bedownbox p{color: #FDFDFD;font-family: cursive;font-size: 13px;font-weight: 400; text-align: right;}
#bebox1{background:
#F9CD2A url(هنا رابط الصورة) no-repeat;background-size: 100% 180px;}
#bebox2{background:
#F9CD2A url(هنا رابط الصورة) no-repeat;background-size: 100% 180px;}
#bebox3{background:
#F9CD2A url(هنا رابط الصورة) no-repeat;background-size: 100% 180px;}
#bebox4{background:
#F9CD2A url(هنا رابط الصورة) no-repeat;background-size: 100% 180px;}
</style>
<div class='befeature'>
<div class='bebox' id='bebox1'>

<div class='beupbox'><h1><a href='
#' target='_blank'><span style='color: #fafafa;'>هنا العنوان</span></a></h1></div>

<div class='bedownbox'><p>
هنا الوصف</p></div>

</div>
<div class='bebox' id='bebox2'>

<div class='beupbox'><h1><a href='
#' target='_blank'><span style='color: #fafafa;'>هنا العنوان</span></a></h1></div>

<div class='bedownbox'><p>
هنا الوصف</p></div>

</div>
<div class='bebox' id='bebox3'>

<div class='beupbox'><h1><a href='
#' target='_blank'><span style='color: #fafafa;'>هنا العنوان</span></a></h1></div>

<div class='bedownbox'><p>
هنا الوصف</p></div>

</div>
<div class='bebox' id='bebox4'>

<div class='beupbox'><h1><a href='
#' target='_blank'><span style='color: #fafafa;'>هنا العنوان</span></a></h1></div>

<div class='bedownbox'><p>
هنا الوصف</p></div></div></div>
* رابط الصورة محددة باللون الأصفر 
* ألوان الصناديق محددة باللون الأخضر
* ضع بدل # رابط الموضوع
* العنوان / الوصف

* بإمكانك إدراج الأكواد الغير قابلة لنشر بتحويله عبر محول الأكواد

تحويل الأكواد إغلاق التعبيرات إخفاء

شكرا لتعليقك
  • أسالني اي سؤال او اطلب مني اي طلب

    ركن الاسألة والطلبات
كل الحقوق ل تقني الانترنت
تقني الانترنت