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

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

كود 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