ولاد عنابة

كود css تكبير صورة مصغرة بشكل مختلف 123_211


انضم إلى المنتدى ، فالأمر سريع وسهل

ولاد عنابة

كود css تكبير صورة مصغرة بشكل مختلف 123_211
ولاد عنابة
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

كود css تكبير صورة مصغرة بشكل مختلف

اذهب الى الأسفل

كود css تكبير صورة مصغرة بشكل مختلف Empty كود css تكبير صورة مصغرة بشكل مختلف

مُساهمة من طرف  الإثنين 20 فبراير 2012 - 1:14

كود css تكبير صورة مصغرة بشكل مختلف 454545

كود css تكبير صورة مصغرة بشكل مختلف Ghfghfghfghf
كود html

الكود:
<div class="thumb">
  <a href="#">
  <img src="ضع صورة هنا1" alt="miniature Inachis-Io" />
  <img src="ضع صورة هنا2
" alt="Inachis-io" class="grand" />
  </a>
 
  <a href="#">
  <img src="ضع صورة هنا1
" alt="miniature Machaon" />
  <img src="ضع صورة هنا2
" alt="Machaon" class="grand"  />
  </a>

  <a href="#">
  <img src="ضع صورة هنا1
" alt="miniature Polyommatus-icarus" />
  <img src="ضع صورة هنا2
" alt="Polyommatus-Icarus" class="grand"  />
  </a>
</div>
كود css


الكود:
body {
 background-color:black;   
 color:white;
 height:500px;
 }

img {
 border:1px solid black;
 }   

.thumb {
 position:relative;
 top:0;
 left:0;
 }
 
.thumb a {
 margin:0;
 text-decoration:none;
 }

.thumb a:hover {
 background-color:black;   
 }

.thumb a .grand {
 display:block;
 position:absolute;
 width:0;
 }    
 
.thumb a:hover .grand {
 position:absolute;
 top:80px;
 left:0;
 width:300px;
 height:225px;
 }

طريقة الوضع : -


الكود يوضع بورقة الــــcss

لوحة الادارة > مظهر المنتدي > الوان > ورقة تصميم css


كود css تكبير صورة مصغرة بشكل مختلف A7med10
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
avatar


الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى