إنشاء ألبوم صور
يمكن إنشاء البوم صور بسهولة عند استخدام لغة CSS
شاهد مثال عن ألبوم الصور
ألبوم الصور
في هذا المثال تم انشاء ألبوم صور باستخدام لغة CSS
<html>
<head>
<style type="text/css">
div.img
{
margin:2px;
border:1px solid #0000ff;
height:auto;
width:auto;
float:left;
text-align:center;
}
div.img img
{
display:inline;
margin:3px;
border:1px solid #ffffff;
}
div.img a:hover img
{
border:1px solid #0000ff;
}
div.desc
{
text-align:center;
font-weight:normal;
width:120px;
margin:2px;
}
</style>
</head>
<body>
<p>يمكن إنشاء ألبوم صور من خلال لغة CSS.</p>
<div class="img">
<a href="css-images/nature_large1.jpg" target="_blank">
<img src="css-images/nature_small1.jpg" alt="كن ميرمج" title="المعهد العربي للبرمجة" />
</a>
<div class="desc">
ضع شرح بسيط عن الصورة
</div></div>
<div class="img">
<a href="css-images/nature_large2.jpg" target="_blank">
<img src="css-images/nature_small2.jpg" alt="اكن مبرمج" title="الكن مبرمج" />
</a>
<div class="desc">
ضع شرح بسيط عن الصورة
</div></div>
<div class="img">
<a href="css-images/nature_large5.jpg" target="_blank">
<img src="css-images/nature_small5.jpg" alt="الكن ميرمج" title="المكن مبرمج" />
</a>
<div class="desc">
ضع شرح بسيط عن الصورة
</div></div>
<div class="img">
<a href="css-images/nature_large6.jpg" target="_blank">
<img src="css-images/nature_small6.jpg" alt="اكن ميرمج" title="كن ميرمج" />
</a>
<div class="desc">
ضع شرح بسيط عن الصورة
</div></div>
</body>
</html>
هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة،هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة
تحويل كودإخفاء محول الأكواد الإبتساماتإخفاء