اضافة صندوق التبادل الاعلانى بشكل رائع جدا CSS

بسم الله الصلاة والسلام على رسول الله , السلام عليكم احبائى وااخوانى 

اقدم لكم اضافة اعلانات بطريقة مميزة ( css / HTML )  للتبادل الاعلانى 

خطوات التركيب بالمدونة :

• بعد التسجيل بمدونتك ودخول لوحة التحكم 
• اضغط على تخطيط 
• بعد ذلك نضغط اضافة اداة  HTML/JavaScript
• ثم نضع الكود التالى 
•  <style>
• #advertise{
•   margin: auto;
• }
•  .adss { list-style:none; margin-top:5px auto; margin: 0 1px 2px 1px; display:inline-block; text-align: center; }
•  .adss a { display:block; width:75px; height:75px; padding-right:0px; padding-top: 3px; position:relative; text-decoration:none; }
•  .adss a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}
•  .adss img { max-height: 75px; max-width: 75px; }
•  #adsanime:hover { opacity:0.2; }
•  #adsanime a strong {
•     -webkit-transition-property: opacity;
•      -webkit-transition-duration: 500ms;
•      -moz-transition-property: opacity;
•       -moz-transition-duration: 500ms; }
•  #adsanime a strong {
•    opacity:0;
•     -webkit-transition-property: opacity, top;
•      -webkit-transition-duration: 300ms;
•       -moz-transition-property: opacity, top;
•        -moz-transition-duration: 300ms; }
•  #adsanime {
•     opacity:0.5;
•      -webkit-transition-property: opacity, top;
•       -webkit-transition-duration: 300ms;
•        -moz-transition-property: opacity, top;
•         -moz-transition-duration: 300ms; }
•  #adsanime:hover { opacity:1; }
•  #adsanime:hover a strong { opacity:1; top:-10px; }
• </style> <center><div class="adss" id="adsanime"><a 
• href="http://add-b.blogspot.com/">    <img src="http://upload.traidnt.net/upfiles/qr456537.gif" />    <strong>اعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a
•  href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong> أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a 
• href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a 
• href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a
•  href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a
•  href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a href="http://add-b.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a 
• href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div><div class="adss" id="adsanime"><a 
• href="http://tech4fans.blogspot.com/">    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg" />    <strong>أعلن هنا</strong></a>     </div></center><a href="http://tech4fans.blogspot.com/"></a>
• التعديلات :
  1- استبدل رابط مدونتي برابط مدونتك
  http://add-b.blogspot.com/
  2- استبدل الاسم باسم مدونتك
  اعلن هنا
  3- استبدل الصورة بالصورة لمدونتك
  https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhch5dzA6Ck2W0vZUaKXJLILRXh2RwEBKslwR85eUjz8YrO53-4iAythOhyg_pWLN0u6xUgz5pyWjo4CRYBIxaN3HZYtUmeWae6arM9b4ISSBBRanTHEGTYEzwnPHm-gzqzgElhvw9G9RNS/s1600/adschange_125-125.jpg
•